0

うまくいけば、これは理にかなっています...

ダイアログボックスをロードするページがあります。ダイアログ ボックスのシェルは、実際にはメイン ページの HTML に存在します (display:none)。ダイアログ ボックスには、次の呼び出しで部分ビューがロードされています。

$('.partial').load(url, function (html) { $('.partial')[0].value = html; });

この部分ビューには 2 つの選択ボックスがあります。最初の値が変更された場合、2 番目の値は .getJason 呼び出しを介して設定する必要があります。その呼び出しは以下です。

$.getJSON(url, function (result) {
    var dropList = $("#select");
    var options = "";
    $.each(result, function () {
        options += '<option value="' + this.ID + '">' + this.Name+'</option>';
    });

    $("#select2").empty().append(options); // doesn't work located on the partial view
    $("#test2").empty().append(options); // works located on main page
});

.getJason 呼び出しは、ページが最初に読み込まれた後に部分ビューが読み込まれるため、onChange="populateSecondSelect()" を指定した関数を介して呼び出されます (この状況では .on は機能しません)。

問題は、オプションを 2 番目の選択にロードしようとしている部分です。jQuery .append は要素を認識しません。メインページの「Test2」に値をロードしようとすると機能するため、呼び出しが機能していることはわかっています。

ロードされた部分ビューで .append する要素をjQueryに認識させるにはどうすればよいですか?

4

2 に答える 2

1

コンテンツが後で読み込まれると、通常、このonメソッドは機能しません。ただし、onメソッドをオブジェクトに直接アタッチできるdocumentため、DOM にまだ追加されていない場合でも、イベントをセレクターにアタッチできます。

$(document).on("change", "#select", populateSecondSelect);

このメソッドはイベントを動的に読み込まれた要素にバインドするために必要ですが、要素を選択して html を追加するだけで期待どおりに動作するはずです。コードのどこかに問題があるのではないかと思います。コードのより完全な例のJSFiddleを投稿してみてください。

于 2013-05-11T02:01:29.533 に答える
0

さて、私は回避策を思いつきました。アイデアは、2 番目の選択ボックスに入力する必要があるということです。それを docuemnt.on 呼び出しでバインドする必要があるため、実際の選択ステートメントでマウスダウンを使用しました。 

$(document).on("mousedown", "#select2", function (){
    if(options != "") {  // that options is "global"
        $(this).empty().append(options);
        options = "";
    }      
});

これで完全に埋まります。よしよし！ここでの問題は、最初の選択が変更されたときに 2 番目の選択の選択肢が表示されることです。これはしなければならないと思います。:(

于 2013-05-11T06:35:55.073 に答える