Как в Choices.js сделать плейсхолдер?

Как сделать плейсхолдер, что бы он при открытии не отображался в списке ?
  • Вопрос задан
  • 2540 просмотров
Пригласить эксперта
Ответы на вопрос 4
@Dupsogod
в первом option не прописывый атрибут value
<select class="js-choice" name="selectName" id="selectID">
  <option>Выберите число</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3и</option>
</select>
Ответ написан
Комментировать
@maya042
HTML,CSS,JS,React
.choices__list--dropdown .choices__placeholder {
display: none;
}
Ответ написан
Комментировать
@KomanDante999
На самом деле нужно совместить оба предложенных варианта:
например выбранному селекту прописать value="" (это обязательно)
<select class="form-select" id="form-select">
          <option value="" selected>Материал</option>
          <option value="1">Древесина</option>
          <option value="2">Металл</option>
          <option value="3">Камень</option>
          <option value="4">Пластик</option>
          <option value="5">Композитный</option>
          <option value="6">Гипс</option>
        </select>

и прописать в CSS
.choices__list--dropdown .choices__placeholder {
display: none;
}


тогда Материалы не будут отображать ся в списке
Ответ написан
Комментировать
@comrad_V
вот так:
<select name="type-of-services" class="p-choices">  
                        <option value="0" placeholder>Выберите вариант</option>
                        <option value="reconstruction">реконструкция</option>
                        <option value="redevelopment">перепланировка</option>
                        <option value="translation">перевод</option>
                        <option value="getting-permission">получение разрешения на новое строительство</option> 
                        <option value="other">иное</option>
                    </select>

и
let currentSelect = new Choices(select, {
                noResultsText: 'Значение не найдено',
                loadingText: 'Загрузка...', 
                searchEnabled: false,
                placeholder: true,
                placeholderValue: null, 
                shouldSort: false,
            });
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы