web-dev-qa-db-ja.com

jQueryでリストを選択するオプションを追加する方法

私の選択リストはdropListBuildingと呼ばれます。次のコードは機能しないようです。

 for (var i = 0; i < buildings.length; i++) {
     var val = buildings[i];
     var text = buildings[i];
     alert("value of builing at: " + i.toString() + " is: " + val);
     $("#dropListBuilding").addOption(val, text, false);
 }

この行は死にます:

$("#dropListBuilding").addOption(val, text, false);

JQueryのドロップダウンにアイテムを追加する権利は何ですか?その行なしでテストしましたが、buildings変数にはデータ要素があります。

63
danila dinan

コードをそれほど複雑にしないでください。 foreachのような反復子を使用することで、以下のように簡単に実行できます。

$.each(buildings, function (index, value) {
    $('#dropListBuilding').append($('<option/>', { 
        value: value,
        text : value 
    }));
});      
121
Haminh Nguyen
$('#dropListBuilding').append('<option>'+val+'</option>');
17
Soufiane Hassou

この方法でそれを行うことは常に私にとってはうまくいきました。これが役立つことを願っています。

var ddl = $("#dropListBuilding");   
for (k = 0; k < buildings.length; k++)
   ddl.append("<option value='" + buildings[k]+ "'>" + buildings[k] + "</option>");
17
James

JQueryオブジェクトでメソッド(addOption)を実行しているため、コードは失敗します(このオブジェクトはメソッドをサポートしていません)

次のような標準のJavaScript関数を使用できます。

$("#dropListBuilding")[0].options.add( new Option("My Text","My Value") )
7
duckyflip

これはうまく機能しています。これを試してください。

var ob = $("#myListBox");

for (var i = 0; i < buildings.length; i++) {
     var val = buildings[i];
     var text = buildings[i];

     ob.prepend("<option value="+ val +">" + text + "</option>");
}
2
Parag Gajjar

既存のコードに従うため、このプラグインが必要なようです。プラグインjsファイルはどこかに残されている可能性があります。

http://www.texotela.co.uk/code/jquery/select/

var myOptions = {
"Value 1" : "Text 1",
"Value 2" : "Text 2",
"Value 3" : "Text 3"
} 
$("#myselect2").addOption(myOptions, false); 
// use true if you want to select the added options » Run
2
Bob

JQueryの3.5 kBプラグインに依存したくない場合、または予約済みのHTML文字をエスケープする際にHTML文字列を構築したくない場合は、次の簡単な方法が機能します。

function addOptionToSelectBox(selectBox, optionId, optionText, selectIt)
{
    var option = document.createElement("option");
    option.value = optionId;
    option.text = optionText;
    selectBox.options[selectBox.options.length] = option;
    if (selectIt) {
        option.selected = true;
    }
}

var selectBox = $('#veryImportantSelectBox')[0];
addOptionToSelectBox(selectBox, "ID1", "Option 1", true);
1
Sebien

私にとってこれはうまくいった

success: function(data){
            alert("SUCCCESS");
            $.each(data,function(index,itemData){
                console.log(JSON.stringify(itemData));
                $("#fromDay").append( new Option(itemData.lookupLabel,itemData.id) )
            });
        }
1
faisalbhagat