Обновление страницы удаляет стили начальной загрузки

Question

Я работаю с bootstrap-select и я новичок в front-end. Я пытаюсь реализовать компонент множественного выбора загрузчика на моей странице, но проблема Я сталкиваюсь с тем, что, когда я отправляю свою страницу на сервер и, если происходит ошибка, он удаляет все классы 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>

Ниже приведен фрагмент кода моей страницы onLoad:

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

Любая помощь будет оценена. Спасибо

Answer 1

Я думаю, что при обновлении классы css удаляются из компонента, что делает его простым списком с множественным выбором. Попробуйте добавить идентификатор для выбора компонента, например, id = "select-picker", а затем форсировать рендеринг со ссылкой на этот идентификатор, как показано ниже:

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

Или, если вы отправляете форму, убедитесь, что вы вызываете эту функцию рендеринга и внутри функции отправки, чтобы обеспечить повторный рендеринг компонента.