Как использовать заполнитель в качестве значения по умолчанию в структуре select2

Ответ 1

Вы должны добавить пустую опцию (т.е. <option></option>) в качестве первого элемента, чтобы увидеть местозаполнитель.

В официальной документации Select2:

"Обратите внимание, что, поскольку браузеры предполагают, что первый элемент выбора выбран в блоках выбора, отличных от нескольких значений, должен быть предоставлен пустой первый элемент опции (<option></option>) для работы заполнитель."

Надеюсь, что это поможет.

Пример:

<select id="countries">
    <option></option>
    <option value="1">Germany</option>
    <option value="2">France</option>
    <option value="3">Spain</option>
</select>

и Javascript будет выглядеть следующим образом:

$('#countries').select2({
    placeholder: "Please select a country"
});

Ответ 2

Поместите это в свой файл скрипта:

$('select').select2({
    minimumResultsForSearch: -1,
    placeholder: function(){
        $(this).data('placeholder');
    }
});

А затем в HTML добавьте следующий код:

<select data-placeholder="Your Placeholder" multiple>
    <option></option> <------ this is where your placeholder data will appear
    <option>Value 1</option>
    <option>Value 2</option>
    <option>Value 3</option>
    <option>Value 4</option>
    <option>Value 5</option>
</select>

Ответ 3

$("#e2").select2({
   placeholder: "Select a State",
   allowClear: true
});
$("#e2_2").select2({
   placeholder: "Select a State"
});

Заполнитель может быть объявлен через атрибут data-placeholder, прикрепленный к select, или через элемент конфигурации placeholder, как показано в примере кода.

Когда заполнитель используется для поля выбора, не содержащего нескольких значений, в качестве первого параметра необходимо включить пустой тег.

При желании, кнопка сброса (видимая после выбора) доступна для сброса поля выбора обратно к значению заполнителя.

https://select2.org/placeholders

Ответ 4

$('#ddlSelect').prepend('<option selected=""></option>').select2({placeholder: "Select Month"});

Ответ 5

Это сработало для меня:

$('#SelectListId').prepend('<option selected></option>').select2({
    placeholder: "Select Month",
    allowClear: true
});

Надеюсь это поможет :)

Ответ 6

Используйте пустой заполнитель на своем html, например:

<select class="select2" placeholder = "">
    <option value="1">red</option>
    <option value="2">blue</option>
</select>

и в вашем script используйте:

$(".select2").select2({
        placeholder: "Select a color",
        allowClear: true
    });

Ответ 7

Я сделал следующее:

var defaultOption = new Option();
defaultOption.selected = true;    
$(".js-select2").append(defaultOption);

Для других вариантов я использую:

var realOption = new Option("Option Value", "id");
realOption.selected = false;    
$(".js-select2").append(realOption);

Ответ 8

Попробуйте это. В html вы пишете следующий код.

<select class="select2" multiple="multiple" placeholder="Select State">
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
</select>

И в вашем script напишите приведенный ниже код. Имейте в виду, что у вас есть ссылка select2js.

<script>
         $( ".select2" ).select2( { } );
 </script>

Ответ 9

самый простой способ добавления пустой опции "перед всеми.

<option></option>

Пример:

<select class="select2" lang="ru" tabindex="-1">
    <option></option>
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
</select>

Также код js, если вам нужно:

$(document).ready(function() {
    $(".select2").select2({
            placeholder: "Select a state",
            allowClear: true
        });
    });
}

Ответ 10

Вы можете инициализировать заполнитель, выбрав HTML-код на двух уровнях, таких как:

<select class="form-control select2" style="width: 100%;" data-placeholder="Select a State">
   <option></option>
   <option>تهران</option>
   <option>مشهد</option>
   <option>اصفهان</option>
   <option>شیراز</option>
   <option>اهواز</option>
   <option>تبریز</option>
   <option>کرج</option>   
</select>

1. установить атрибут data-placeholder в вашем теге выбора 2. установить пустой тег в первом теге выбора

Ответ 11

$selectElement.select2({
    minimumResultsForSearch: -1,
    placeholder: 'SelectRelatives'}).on('select2-opening', function() {                                                                       $(this).closest('li').find('input').attr('placeholder','Select Relative');                            
});