bootstrap-select需要注意的问题

  • bootstrap-select普通的模糊查询按照如下方式便可,在select标签中增加**class=“selectpicker” data-live-search=“true” **
				<select class="selectpicker" data-live-search="true" id="game" name="game">
                <c:forEach items="${games}" var="ga">
                    <option value="${ga.id}">${ga.name}</option>
                </c:forEach>
            </select>
  • 如果是动态添加数据,如下所示。则需要添加 ( &quot; . s e l e c t p i c k e r &quot; ) . s e l e c t p i c k e r ( ′ r e f r e s h ′ ) ; 和 (&quot;.selectpicker&quot;).selectpicker(&#x27;refresh&#x27;);和 (".selectpicker").selectpicker(refresh);(".selectpicker").selectpicker(‘render’);
			$.each(data.tasks, function (index, value) {
                    arr += "<option value=\'" + value.taskId + "\'>" + value.taskName + "</option>";
                });
              
                $("#taskName").append(arr);
                $(".selectpicker").selectpicker('refresh');
                $(".selectpicker").selectpicker('render');
            },
  • 如果整个select框是动态添加的,我们不能沟通过clone的方式进行clone某个含有bootstrap-select的select框(我使用不可以clone),如下方式是不行的
$('#channel_container').append($('#channel_model').children().clone(true));//clone导致bootstrap-select模糊查询失效

我们可以通过append方式进行动态添加,如下所示:

 $('.channel_container').append('<div class="row channel_model">\n' +
            '                <div class="span4">\n' +
            '                    <input type="hidden" name="channelId" id="channelId">\n' +
            '                    <label  class="control-label col-md-1">渠道:</label>\n' +
            '                    <div class="channel">\n' +
            '                        <select  class="selectpicker" data-live-search="true" >\n' +
            '                            <c:forEach items="${customerForms}" var="item">\n' +
            '                                <option value="${item.customerId}">${item.name}</option>\n' +
            '                            </c:forEach>\n' +
            '                        </select>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '                <div class="span4">\n' +
            '                    <label for="demandAmount" class="control-label col-md-1">需求数量:</label>\n' +
            '                    <div class="demandAmount">\n' +
            '                        <input name="demandAmount" type="text" id="demandAmount"/>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '                <button class=\' btn btn-default span1\' onclick="removeChannel(this)" type=\'button\'><span\n' +
            '                        class=\'icon-trash\'></span></button>\n' +
            '            </div>');
        $(".selectpicker").selectpicker('refresh');
        $(".selectpicker").selectpicker('render');
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值