質問にあるように、jQuery を使用して DropDownList コントロールの値を設定するにはどうすればよいですか?
17 に答える
$("#mydropdownlist").val("thevalue");
options タグの値が val メソッドの値と一致することを確認してください。
@Nick Berardi が示唆するように、変更した値が UI フロントエンドに反映されない場合は、次を試してください。
$("#mydropdownlist").val("thevalue").change();
インデックスを操作する場合は、選択したインデックスを .attr() で直接設定できます。
$("#mydropdownlist").attr('selectedIndex', 0);
これにより、ドロップリストの最初の値に設定されます。
編集: 上記の方法は以前は機能していました。しかし、それはもはやそうではないようです。
しかし、Han がコメントでとても喜んで指摘しているように、それを行う正しい方法は次のとおりです。
$("#mydropdownlist").get(0).selectedIndex = index_here;
この非常に単純なアプローチを試してください。
/*make sure that value is included in the options value of the dropdownlist
e.g.
(<select><option value='CA'>California</option><option value='AK'>Alaska</option> </select>)
*/
$('#mycontrolId').val(myvalue).attr("selected", "selected");
ドロップダウンが Asp.Net ドロップダウンの場合、以下のコードは正常に動作します。
$("#<%=DropDownName.ClientID%>")[0].selectedIndex=0;
ただし、DropDown が HTML ドロップダウンの場合、このコードは機能します。
$("#DropDownName")[0].selectedIndex=0;
それを行うには多くの方法があります。ここにそれらのいくつかがあります:
$("._statusDDL").val('2');
また
$('select').prop('selectedIndex', 3);
これが役立つと思います:
$.getJSON('<%= Url.Action("GetDepartment") %>',
{ coDepartment: paramDepartment },
function(data) {
$(".autoCompleteDepartment").empty();
$(".autoCompleteDepartment").append($("<option />").val(-1));
$.each(data, function() {
$(".autoCompleteDepartment").append($("<option />").val(this.CodDepartment).text(this.DepartmentName));
});
$(".autoCompleteDepartment").val(-1);
}
);
このようにすると、テキストのない要素が追加されます。そのため、de コンボをクリックしても表示されませんが、追加した値 -1 は後で $(".autoCompleteDepartment").val(-1); で選択します。コンボに有効な値があるかどうかを制御できます。
それが誰にも役立つことを願っています。
私の英語でごめんなさい。
<options ....></options>
Ajax 呼び出しですべてロードする場合は、
次の手順に従ってください。
1)。ドロップダウンの値を設定するための別のメソッドを作成する
例:
function set_ip_base_country(countryCode)
$('#country').val(countryCode)
}
2)。ajax 呼び出しが成功し、すべての html 追加タスクが完了したときに、このメソッドを呼び出します
例:
success: function (doc) {
.....
.....
$("#country").append('<option style="color:black;" value="' + key + '">' + value + '</option>')
set_ip_base_country(ip_base_country)
}
選択したオプションをすばやく設定するために作成された関数を次に示します。
function SetSelected(elem, val){
$('#'+elem+' option').each(function(i,d){
// console.log('searching match for '+ elem + ' ' + d.value + ' equal to '+ val);
if($.trim(d.value).toLowerCase() == $.trim(val).toLowerCase()){
// console.log('found match for '+ elem + ' ' + d.value);
$('#'+elem).prop('selectedIndex', i);
}
});
}
引数要素 ID と選択した値を指定してこの関数を呼び出します。このような:
SetSelected('selectID','some option');
設定する選択肢が多い場合に便利です。
値を設定drop-down
selected
して変更を更新する
$("#PR2DistrictId option[value='@Model.PR2DistrictId']").attr("selected", true).trigger("chosen:updated")
ここでは、最初に値を設定Model
し、選択した値を更新しました