多选框设置默认多选----从数据库获取

时间:2019-08-06
本文章向大家介绍多选框设置默认多选----从数据库获取,主要包括多选框设置默认多选----从数据库获取使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
<select id="weekDate"
                                                class="selectpicker show-tick form-control" multiple
                                                data-live-search="false">
                                                <option value="1">${map.sunday}</option>
                                                <option value="2">${map.monday}</option>
                                                <option value="3">${map.tuesday}</option>
                                                <option value="4">${map.wednesday}</option>
                                                <option value="5">${map.thursday}</option>
                                                <option value="6">${map.friday}</option>
                                                <option value="7">${map.saturday}</option>
                                            </select>
<script>
     var selectedArray='${sPeriodEvent.weekPeriod}';//获取到默认值
        var Array = selectedArray.split(",");
        //以,将selected字符创切割成字符串数组
        var mulselect=document.getElementById("weekDate");
        //找到复选框的位置
        var muloptions=mulselect.options;//获取复选框的选择项
        for(var j=0;j<selectedArray.length;j++) {
            for (var i = 0; i < muloptions.length; i++) {
                if (muloptions[i].value == Array[j]) {
                    muloptions[i].setAttribute("selected",true)
                    //遍历字符串数组和复选框选择项,当有匹配的,就把该选项设置                         //成已选择
                }
            }
        }
</script>

数据库中的字段是字符串以', '分隔开的,获取需要的字段后,将字符串分割成数组,获取多选框的元素;拿到多选框的options,外层for循环遍历字符串;内层for循环遍历多选框,当数组的值等于多选框中的value值时则将其设置为选中状态。

原文地址:https://www.cnblogs.com/ys15/p/11311727.html