недопустимый класс не работает на компоненте начальной загрузки - PullRequest
0 голосов
/ 04 февраля 2019

Я использую следующий код для отображения компонента начальной загрузки:

<select class="form-control" id="strengthUnit" th:field="*{strengthUnit}" title="Select Strength Units"
    th:classappend="${validated == true ? (#fields.hasErrors('strengthUnit') ? 'is-invalid' : 'is-valid') : ''}">
    <option value="" label="Select Strength Units"></option>
    <option th:each="strengthUnitTemp : ${strengthUnits}" th:value="${strengthUnitTemp.id}" 
        th:text="${strengthUnitTemp.name}"></option>
</select>

Когда объект, содержащий это поле, отправляется в контроллер, я возвращаю логическое значение «проверено», если естьошибки в данных.С этим значением, как вы можете видеть в атрибуте th: classappend, я динамически добавляю классы is-valid или is-invalid, чтобы выделить поле зеленым или красным цветом, а также галочкой или X. Это отлично работаетпока я не превращу его в компонент начальной загрузки, добавив класс selectpicker и атрибут data-live-search, как показано ниже:

<select class="form-control selectpicker" id="strengthUnit" th:field="*{strengthUnit}" 
    data-live-search="true" title="Select Strength Units"
    th:classappend="${validated == true ? (#fields.hasErrors('strengthUnit') ? 'is-invalid' : 'is-valid') : ''}">
    <option value="" label="Select Strength Units"></option>
    <option th:each="strengthUnitTemp : ${strengthUnits}" th:value="${strengthUnitTemp.id}" 
        th:text="${strengthUnitTemp.name}"></option>
</select>

Сам компонент функционирует отлично, но выглядит как недопустимый классбольше не "правильно отображается" компонентом bootstrap-select.Мои сообщения об ошибках все еще отображаются под компонентом, так что функциональность все еще там, но я действительно хочу, чтобы это красное выделение поля и значок X отображались.

****** РЕДАКТИРОВАТЬ ******

При ближайшем рассмотрении красная или зеленая подсветка все еще работает, но значок галочки / X больше не отображается, так какстрелка, указывающая вниз компонента начальной загрузки, кажется, находится в том же месте.Ниже вы можете увидеть разницу между обычным и выбранным компонентом выбора после успешной проверки.Обратите внимание на то, как стрелка сдвигается в сторону от обычного, и стрелка скрывает галочку на селекторе выбора.

enter image description here

Кто-нибудь когда-либо сталкивался с этимраньше?

Спасибо!

...