JQuery Bootstrap Multiselect 插件 - 在多选下拉列表中设置一个值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6966260/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery Bootstrap Multiselect plugin - Set a value as selected in the multiselect dropdown
提问by Prince
I am having a multiselect dropdown using the Boostrap Multiselect plugin (http://davidstutz.de/bootstrap-multiselect/) as below
我有一个使用 Boostrap Multiselect 插件(http://davidstutz.de/bootstrap-multiselect/)的多选下拉菜单,如下所示
<select id="data" name="data" class="data" multiple="multiple">
<option value="100">foo</option>
<option value="101">bar</option>
<option value="102">bat</option>
<option value="103">baz</option>
</select>
On load of page, i will get an array of value like [101,102]. I should iterate through the array and make the values selected(check boxes corresponding to the ids should be checked). Please help.
在页面加载时,我会得到一个像 [101,102] 这样的值数组。我应该遍历数组并选择值(应选中对应于 id 的复选框)。请帮忙。
采纳答案by Prince
Thank you all for your answers.
谢谢大家的答案。
Taking all of your answers as a guideline, I resolved the problem with the below code:
以您的所有答案为指导,我使用以下代码解决了问题:
var valArr = [101,102];
i = 0, size = valArr.length;
for(i; i < size; i++){
$("#data").multiselect("widget").find(":checkbox[value='"+valArr[i]+"']").attr("checked","checked");
$("#data option[value='" + valArr[i] + "']").attr("selected", 1);
$("#data").multiselect("refresh");
}
Thanks once again for all your support.
再次感谢大家的支持。
回答by Tapon Sayeem
//Do it simple
var data="1,2,3,4";
//Make an array
var dataarray=data.split(",");
// Set the value
$("#multiselectbox").val(dataarray);
// Then refresh
$("#multiselectbox").multiselect("refresh");
回答by Yatin
It's supposed to be as simple as this:
它应该像这样简单:
<select id='multipleSelect' multiple='multiple'>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<script type='text/javascript'>
$('#multipleSelect').val(['1', '2']);
</script>
Check my Fiddle: https://jsfiddle.net/luthrayatin/jaLygLzo/
回答by Shef
var valArr = [101,102], // array of option values
i = 0, size = valArr.length, // index and array size declared here to avoid overhead
$options = $('#data option'); // options cached here to avoid overhead of fetching inside loop
// run the loop only for the given values
for(i; i < size; i++){
// filter the options with the specific value and select them
$options.filter('[value="'+valArr[i]+'"]').prop('selected', true);
}
回答by Basant Rules
work fine for me ,change ids according to you requirement.
对我来说工作正常,根据您的要求更改 ID。
$("#FormId select#status_id_new").val('');
$("#FormId select#status_id_new").multiselect("refresh");
回答by zb'
that code should help:
该代码应该有帮助:
var selected=[101,103];
var obj=$('#data');
for (var i in selected) {
var val=selected[i];
console.log(val);
obj.find('option:[value='+val+']').attr('selected',1);
}
回答by PodTech.io
from a php array into the multiselect...
从一个 php 数组到多选...
$PHP_array=array(); // create array anyway you need to in PHP
array_push($PHP_array,20); // Single ID values
array_push($PHP_array,22);
$javascript_str = json_encode($PHP_array); // JSON ENCODE
// then in the JS script
// 然后在 JS 脚本中
$("#multiselectbox").val(<?php echo $javascript_str; ?>);
// Then refresh
$("#multiselectbox").multiselect("refresh");
回答by Sree
I got a better solution from jquery-multiselect documentation.
我从jquery-multiselect 文档中得到了一个更好的解决方案。
var data = [101,102];
$("#data").multiSelect('deselect_all');
$("#data").multiSelect("select",data);
回答by vientoho
The official sitehas mentioned (in "Manually check or uncheck a checkbox?" section) just to use click()
该官方网站已经(在“手动检查或取消选中复选框?”一节)提到的只是使用点击()
e.g.
例如
$("#ddl_singleSelect")
.multiselect("widget")
.find(":radio[value='']").click(); // change displayed selectedText
$("#ddl_singleSelect option[value='']")
.prop("selected", true) // change val()
.trigger("change"); // fire change event
$("#ddl_multiselect").multiselect("uncheckAll"); // init by de-selecting all
$("#ddl_multiselect")
.multiselect("widget")
.find( ":checkbox[value='1']"
+ ",:checkbox[value='2']"
+ ",:checkbox[value='3']"
+ ",:checkbox[value='4']"
).click(); // change displayed selecetdText
$("#ddl_multiselect")
.find( "option[value='1']"
+ ",option[value='2']"
+ ",option[value='3']"
+ ",option[value='4']"
).prop("selected", true); // change val()
$("#ddl_multiselect").trigger("change"); // fire change event
OR by HTML
或通过HTML
<select name="example-presets" multiple="multiple" size="5">
<option value="option1" selected="selected">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3" selected="selected">Option 3</option>
<option value="option4" selected="selected">Option 4</option>
<option value="option5" disabled="disabled">Option 5</option>
<option value="option6" disabled="disabled">Option 6</option>
<option value="option7">Option 7</option>
<option value="option8">Option 8</option>
<option value="option9">Option 9</option>
</select>
....
<script type="text/javascript">$("select").multiselect();</script>
回答by Anubhav Trivedi
var valArr = ["1","2","3"];
/* Below Code Matches current object's (i.e. option) value with the array values */
/* Returns -1 if match not found */
$("select").multiselect("widget").find(":checkbox").each(function(){
if(jQuery.inArray(this.value, valArr) !=-1)
this.click();
});
This selects the options whose value matches with values in array.
这将选择其值与数组中的值匹配的选项。