刷新页面删除引导选择样式答案

【问题标题】：Refreshing page removes bootstrap-select stylings刷新页面删除引导选择样式
【发布时间】：2018-10-16 21:40:49
【问题描述】：

我正在使用 bootstrap-select 并且我是前端新手。我正在尝试在我的页面中实现引导程序的多选组件，但问题是我面临的是，当我将页面提交到服务器时，如果发生错误，它会从选择框中删除所有 css 类，并仅显示多选列表而不是原始组件。我使用的组件是This，下面是我尝试使用该组件的jsp代码。

<spring:bind path="userClients">
   <div id="customerSelect" class="${status.error ? 'has-error' : ''}" style="margin-top:20px; margin-bottom:15px height:30px">
       <form:select  class="selectpicker form-control"  path="userClients" multiple="multiple" name="userClients">
            <c:forEach var="clientInfo" items="${clients}">
               <form:option value="${clientInfo.env}">${clientInfo.env}</form:option>
            </c:forEach>
        </form:select>
        <div class="${status.error ? 'has-error' : ''}">
        <form:errors  path="userClients" ></form:errors>
        </div>
   </div>
   </spring:bind>

以下是我的 pageOnLoad 代码块：

 $(document).ready(function() {
     $('select').selectpicker();
 });

任何帮助将不胜感激。谢谢

【问题讨论】：

标签： javascript jquery css twitter-bootstrap select

【解决方案1】：

我认为在刷新时，css 类会从组件中删除，从而使其成为一个简单的多选列表。尝试添加一个 id 来选择组件，例如id="select-picker" 然后强制使用此 id 的引用进行渲染，如下所示：

$(document).ready(function() {
    $('#select-picker').selectpicker('render');
}

或者，如果您要提交表单，请确保您也在提交函数内部调用此渲染函数，以确保正确重新渲染组件。

【讨论】：

欢迎@NyleHassan :)