jQuery multiselect初始化及默认值修改

魏安宁
2023-12-01

<link href="../jQuery.multiselect.css" rel="stylesheet"/>
<link href="../jquery.multiselect.filter.css" rel="stylesheet"/>

<script type="text/JavaScript" src="../jquery.multiselect.js"></script>
<script type="text/javascript" src="../jquery.multiselect.filter.js"></script>


js部分:

$(document).ready(function(){

$("#sceneIdSelectBox").multiselect({
            multiple: true,
            header: false,
            noneSelectedText: '请选择',
            selectedList:5,
            minWidth:160,
            height:100
        }); 

//初始化默认选中已有的选项,sceneIdList是要默认选中的值

     var sceneIdList = "1,2,3";

      sceneIdArr = sceneIdList.split(",");

      $('#sceneIdSelectBox option').each(function(i,content){
                     //alert(i+"***"+content.value);
                    if($.inArray($.trim(content.value),sceneIdArr)>=0){
                        this.selected=true;
                         }
                     });

        //设置选中值后,需要刷新select控件
         $("#sceneIdSelectBox").multiselect('refresh');



jsp部分:

<select id="sceneIdSelectBox"  name="sceneIdSelectBox" multiple="multiple" class="fleft ">
                         <c:forEach var="dimScenes" items="${dimScenesList}" varStatus="st">
                             <c:if test="${dimScenes.sortNum > 0}">
                                  <option value="${dimScenes.sceneId}">${dimScenes.sceneName}</option>
                               </c:if>
                           </c:forEach>
 </select>


备注: dimScenesList是在后台从数据中查出的列表,用于展现为下拉列表

//下面是获取选中的值,值的形式是逗号分隔,eg:"1,2"

var sceneIdsStr = $("select").multiselect("getChecked").map(function(){
                       return this.value;    
                    }).get();


select 属性加上multiple="multiple",会默认显示为空,不加的话会默认选中第一项

多选框选中值:

var yhctlModel = $("#multiSelect").multiselect("getChecked").map(function(){
   return this.value;
}).get();
console.info(yhctlModel);


注意:模态窗口里边不能使用jquery的多选下拉列表框。而bootstrap的可以

 类似资料: