Текст-заполнитель для выбранного плагина для одиночного выбора не работает

У меня есть выбранный плагин для одного выбора, реализованного в моем коде. Я пытаюсь добавить текст "Заполнитель" для полей поиска, но я не могу. Я пробовал следующие вещи:

<select id="search_pi" name="search_pi" type="text" class="chosen-select"
        style="width:450px;" onchange="this.form.submit()" >

  <option value="">Search Project/Initiative...</option>
  <?php
    include "../includes/search_dropdown.php";
    foreach($proj_ini_Array as $qa){
      echo "<option value = \"$qa\">$qa</option>";
    }
  ?>

JS

<script>
  $(document).ready(function() {
    $('.chosen-select').chosen({
      placeholder_text_single: "Select an option",
      no_results_text: "Oops, nothing found!"
    });  
  });
</script>

В поле выбора я также попытался использовать data-placeholder="Select an option", но это тоже не помогает. Может кто-нибудь, пожалуйста, сообщите мне, что мне не хватает?

Спасибо заранее.

ОТВЕТЫ

Ответ 1

Хорошо. Я узнал ответ. Нам нужно, чтобы первый вариант был пустым для текста заполнителя, который должен быть активирован для окна поиска одиночного выбора.

<select id="search_pi" name="search_pi" type="text" class="chosen-select" style="width:450px;" onchange="this.form.submit()" >

  <option> </option>
  <?php
    include "../includes/search_dropdown.php";
    foreach($proj_ini_Array as $qa){
      echo "<option value = \"$qa\">$qa</option>";
    }
  ?>

В приведенном выше случае текст заполнителя будет по умолчанию "Выбрать вариант".

Для индивидуального текста-заполнителя для одного окна выбора поиска вы можете отредактировать свой файл js, как показано ниже, и иметь первый вариант для текста, который будет отображаться:

<script>
  $(document).ready(function() {
    $('.chosen-select').chosen({
      placeholder_text_single: "Select Project/Initiative...",
      no_results_text: "Oops, nothing found!"
    });  
  });
</script>

Ответ 2

использовать data-placeholder="YOUR TEXT" в теге select

Ответ 3

Чтобы сделать свой первый вариант просто инструктивным текстом, но неспособным для его выбора, используйте это:

<option selected="selected" disabled>Search Project/Initiative...</option>

* Изменить *

Ах, извините, я не читал ваш вопрос достаточно ясно, чтобы начать.

По-видимому, первый <option> должен быть пустым. См. этот jsfiddle.

Ответ 4

На самом деле это лучшее/простое решение этой проблемы, если вы строите через HTML, а не JS. Вы должны сделать две вещи.

  • Первый <option> в вашем <select> должен быть пустым.
  • Вы должны включить placeholder="Placeholder goes here" в свой <select>. По-видимому, это когда-то называлось data-placeholder, что, по-моему, привело к некоторой путанице.

Итак, всего:

<select placeholder="Placeholder goes here">
    <option><!-- Empty option goes here. --><option>
    <option>Other Option</option>
</select>

Ответ 5

Ответ пользователя @Zack Joerdan решил мою проблему. Таким образом, spring требуемое значение внутри опции

<select placeholder="Placeholder goes here">
    <option value=""><!-- Empty option goes here. --><option>
    <option>Other Option</option>
</select>