-4

フォームがあります

<html>
<head>
</head>
<body>
<form>
    <select id="groups">
    <optgroup label="GroupA">
    <option value="2">[GroupA]  value1</option>
    <option value="11">[GroupA] value2</option>
    <option value="14">[GroupA] value3</option>
    <option value="15">[GroupA] value4</option>
    <option value="601">[GroupA] value5</option>
    <option value="21">[GroupA] value6</option>
    <option value="23">[GroupA] value7</option>
    <option value="24">[GroupA] value8</option> 
    </optgroup>
    ...
 </select>
</form>
<br />
<div id="txtHint"><b>Show edit form here.</b></div>

</body>
</html>

ユーザーがドロップダウンリストから値を選択すると、編集フォームが表示され、選択された値を使用して編集値がクエリされます。誰でもphp、ajax、jqueryでこれを行うのを手伝ってくれますか？

ありがとう

4

3 に答える 3

1

まあ、これを行うにはかなりの数の方法があります。

1つの方法は、selectドロップダウン値に基づいてHTMLフラグメントを返す値でヒットできるURLを設定することです。

基本的なフローは次のとおりです。

Javascriptコード：

$('select_id_here').change(function() {
  var url = "path_here/to_something
  $.ajax({
    url: url,
    type: "get",
    data: {
      "value": this.val()
    }
}).done(function(html) {
  $('txtHint').html(html)
});

PHPコントローラーには、呼び出しているURLを処理し、値に応じてhtmlを返す関数があります。これをどのように行うかは、使用しているフレームワークによって異なります。

function handle_to_something() {
  $value = $_GET['value']; // horrible to use GET array
  $html = render("path/to/template/$value.html");
  return $html;
}
于 2012-06-14T20:57:34.437 に答える
1

要素の周囲に追加する必要があるドロップダウン/選択ボックスの選択された値を取得するには、次のようにjQueryを使用して取得できます。

<select id="groups">
  <optgroup label="GroupA"> 
    <option value="2">[GroupA]  value1</option>
    ....
  </optgroup>
</select>

$(function() {
  $("#groups").change(function() {
      var selectedValue = this.val();
  });
});
于 2012-06-14T20:49:41.367 に答える
1

うーん、多分あなたは試してみることができます：

$("select#idOfYourSelectElement").change(function(){
    $.ajax({
        url: "ajax/myphpajax.php",
        data: "acction=loadForm&selectedElement=" + $(this).val(),
        async: false,
        success: function(htmlWithNewForm){
            $("div#txtHint").html(htmlWithNewForm);
            //if the div is hidden
            $("div#txtHint").css("visibility","visible");
        }
    });
});
于 2012-06-14T20:52:51.287 に答える