select2設置select多選,select2取值和賦值,作為篩選條件的時候,取值相對簡單,把選中的id值轉為字符串傳給后端查詢,查詢之后會刷新頁面,為了在下拉框中顯示剛剛選中的值,就需要給select賦值,可以將剛才傳給后端的字符串再傳回前端,然后轉為一位數組,再賦值給select2就會顯示剛剛選中的值,賦值方法:$('#id').val(arr).trigger('change'),id為select的id屬性,這里的arr是剛才從后端傳回前端的id轉成的一位數組。
select2設置select多選,select2取值和賦值,首先需要引入select2的js文件,select2官網地址:https://select2.org/
//select2html代碼設置選項,list為后端查詢出來的選項,循環賦值
-
<select name="id" id="id" multiple="multiple">
-
<option value="0">請選擇部門</option>
-
<volist name="list" id="vo">
-
<option value="{$vo.id}" <eq name="vo.id" value="$id">selected = "selected" </eq>>{$vo.name}</option>
-
</volist>
-
</select>
//可以另外設置一個隱藏的input框來存select選中的id,方便傳給后端
<input type="hidden" id="select_id" name="select_id"/>
//select2插件初始化
-
$( "#id").select2({
-
language : "zh-CN",
-
minimumInputLength : 0,
-
placeholder:"可多選",//默認值
-
allowClear: true,
-
})
//select2插件賦值
-
var select_id = $("#select_id").val();
-
arr = select_id.split( ",");//注意:arr為select的id值組成的數組
-
$( '#id').val(arr).trigger('change');
//select2多選,取值,在下拉框中選中以后,獲取到選擇的id值
-
$( '#id').change(function(){
-
var o=document.getElementById('id').getElementsByTagName('option');
-
var all="";
-
console.log(o[1]);
-
for(var i=0;i<o.length;i++){
-
if(o[i].selected){
-
all+=o[i].value+ ",";
-
}
-
}
-
-
all = all.substr( 0, all.length - 1);//去掉末尾的逗號
-
$( "#bumen").val(all);//賦值給隱藏的文本框
-
})
select2設置select多選,select2取值和賦值大概就這些了,也是網上找了很多資料,嘗試了很多次,因為剛開始不知道$('#id').val(arr).trigger('change');里面的arr是個啥,最開始以為是數據,text,賦值了一些字符串,所以一直沒用。