jQuery 如何使用 Bootstrap Multiselect 获取所有选定的值并在 AJAX 中使用它
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29738796/
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
How to get all selected values using Bootstrap Multiselect and use it in AJAX
提问by Sachi Tekina
I am using Bootstrap Multiselect, this is my setup in my HTML:
我正在使用Bootstrap Multiselect，这是我在 HTML 中的设置：
<div class="form-group">
<select class="form-control" id="bldg_type" multiple="multiple">{% for type in buildings %}
<option value="{{type.bldg_type}}">{{type.bldg_type}}</option>{% endfor %}
</select>
</div>
I wanted to use the selected values for my query, the snippet of my Ajax code:
我想为我的查询使用选定的值，我的 Ajax 代码片段：
$.ajax({
url: "cnt_bldg/",
type: "GET",
dataType: "JSON",
data: {
'brgy_id': brgy_id,
'bldg_type': $('#bldg_type option:selected').val()
},
...
The problem with $('#bldg_type option:selected').val()is I can only get 1 value. For e.g. I check Marketand Police Stationin my select option, and looked it in my console http://127.0.0.1:8000/cnt_bldg/?brgy_id=All&bldg_type=Market".It only gets the Market.
问题$('#bldg_type option:selected').val()是我只能得到 1 个值。例如，我检查Market并Police Station在我的选择选项中，并在我的控制台中查看http://127.0.0.1:8000/cnt_bldg/?brgy_id=All&bldg_type=Market".它只获取Market.
How do I get all the values and use it for my query?
如何获取所有值并将其用于查询？
BTW, I'm using Django. I have read this answeralready, but I don't know how to use the result in my AJAX code above.
顺便说一句，我正在使用 Django。我已经阅读了这个答案，但我不知道如何在上面的 AJAX 代码中使用结果。
采纳答案by Guruprasad Rao
<div class="form-group">
<select id="multiselect1" class="form-control" id="bldg_type" multiple="multiple">{% for type in buildings %}
<option value="{{type.bldg_type}}">{{type.bldg_type}}</option>{% endfor %}
</select>
</div>
Add an Id multiselectto your select control.
将 Id 添加multiselect到您的选择控件。
Declare a variable globally in your javascript as below:
在您的 javascript 中全局声明一个变量，如下所示：
var selected = [];
Initialize it as below [from the answer link you provided]
将其初始化如下[来自您提供的答案链接]
$('#multiselect1').multiselect({
selectAllValue: 'multiselect-all',
onChange: function(element, checked) {
var brands = $('#multiselect1 option:selected');
$(brands).each(function(index, brand){
selected.push([$(this).val()]);
});
}
});
Send it through your ajax.
通过你的ajax发送。
$.ajax({
url: "cnt_bldg/",
type: "GET",
dataType: "JSON",
data: {
'brgy_id': brgy_id,
'bldg_type': selected //This will send the values as list of strings
},
...
Note -While manipulating the received values, accept it as List of strings in your server method!!
注意 -在操作接收到的值时，将其作为服务器方法中的字符串列表接受！！
回答by kite
have you tried simple
你试过简单吗
$('#bldg_type').val()
It works in my bootstrap-multiselect.
它适用于我的引导多选。
回答by Afsal KK
HTML
HTML
<div class="form-group">
<select id="multiselect1" class="form-control" id="bldg_type" multiple="multiple">{% for type in buildings %}
<option value="{{type.bldg_type}}">{{type.bldg_type}}</option>{% endfor %}
</select>
</div>
Jquery
查询
var selected = $('#multiselect1').val()
回答by Chait
Its really simple to get the values of the multiselect options.
获取多选选项的值非常简单。
$('#bldg_type').multiselect({
onChange: function(){
var selectedOptions = $('#bldg_type').val();
console.log(selectedOptions);
}})
The selectedOptions should give you a list of selected options. It gives all the values which are selected from the options in the select tag.
selectedOptions 应该为您提供所选选项的列表。它给出了从 select 标签中的选项中选择的所有值。
You could define the selectedOptions variable some where globally so that the ajax call can access it.
您可以在全局某个位置定义 selectedOptions 变量，以便 ajax 调用可以访问它。
Good luck and hope it helps
祝你好运，希望它有帮助
