Bootstrap select多选以及数据回显

最近一直在用 bootstrap selectpicker 的一些东西,先看效果如下:

GitHub链接,http://silviomoreto.github.io/bootstrap-select/

直接clone下来,获取包

链接:https://pan.baidu.com/s/1Iset8doXqv_ZSH_jzeckFg 
提取码:etyl 

解压,获取所用到的js,css

在jsp页面引入

<link rel="stylesheet" type="text/css" href="${contextPath }/resources/bootstrap/css/bootstrap-select.min.css" rel="stylesheet" ></link>
<script src="${contextPath}/resources/bootstrap/js/bootstrap-select.min.js"></script>

div代码

<div class="col-md-2" style="width: 10%;">
                            <select class="form-control selectpicker" id="entryStatesIDrwh"
                                name="entryStates" multiple="multiple" title="<s:message code="page.entry.state.choose"/>">
                                <option value="0"><s:message code="page.entry.state.unreleased"/></option>
                                <option value="1"><s:message code="page.entry.state.released"/></option>
                                <option value="2"><s:message code="page.entry.state.releaseAndUpdate"/></option>
                                <option value="3"><s:message code="page.entry.state.offline"/></option>
                                <option value="4"><s:message code="page.entry.state.offlineAndUpdate"/></option>
                            </select>
</div>

加入页面加载即加载状态

$(function() {  
     //初始化刷新数据  
    $(window).on('load', function() {  
        $('#entryStatesIDrwh').selectpicker('val', ${entryStates});
    });  
});  

注:

${entryStates} 为后台返回的数组,格式为[1,2,3]

另:

使用此控件时,如果有 disabled 判断的语句,如下

refesh必须用,否则无法使disabled失效。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值