1

http://jsfiddle.net/ueDTd/のように選択オプションの値を変更しても、オプションが AJAX によって設定されている場合は機能しません。

これは、フォームが無効であることが判明したため (必須フィールドの欠落など)、ページのリロード後にオプションを元の状態に戻すことになっています。

その結果、動的に取り込まれた最初の結果に常に変化し、これもたまたま値が「1」になります。

AJAX 呼び出しを含むコード全体を次に示します。

$(document).ready( function() {

var dh_json;
var url = base_url+'doc_headings/get_json_doc_headings';
$.ajax({
        url: url,
        dataType: 'json',
        success: function(encoded_json){
            dh_json = encoded_json;
            $.each(encoded_json, function(key, index) {
                $('#doc_headings').append(
                    $('<option>', { value : index.id } )
                    .text(index.content)
                );
            }); 
        } // End of success function of ajax form
}); // End of ajax call    

$('#doc_headings').change(function() {
   var dh_el_value = $('#doc_headings').val();
  $.each(dh_json, function(key, index) {
    if (index.id == dh_el_value) {
        $('#body').attr("placeholder", index.directions);
    }
  });
});

$('select#doc_headings').val(doc_headings_selected);

});

select 要素の HTML は次のとおりです。

        <select id="doc_headings" name="doc_headings">
        <option disabled="disabled" value="no" selected="selected"> - Document Type - </option>
    </select>

ajaxで生成されたオプションで選択フィールドの値を変更するにはどうすればよいですか?

4

2 に答える 2

1

何が起こっている：

  1. AJAX リクエストの送信
  2. 次に、「$('select#doc_headings').val(doc_headings_selected);」の実行に移ります。
  3. サーバーから応答を受信し、選択メニューにデータを入力している ajax 呼び出しで成功関数を起動します。

コードの最後の行 (以下にリスト) を ajax 呼び出しの success 関数の最後に移動すると、機能するはずです。

$('select#doc_headings').val(doc_headings_selected);
于 2013-05-20T21:34:00.163 に答える
1

onのように使う

$('#doc_headings').on('change',function() {
 var dh_el_value = $('#doc_headings').val();
$.each(dh_json, function(key, index) {
if (index.id == dh_el_value) {
    $('#body').attr("placeholder", index.directions);
}
 });
});
于 2013-05-20T21:29:04.920 に答える