Select2 Dropdown - Множественное окно поиска Mess - «Поиск ...», отображаемый несколько раз, проблемы с оформлением - PullRequest
Новая
       15

Select2 Dropdown - Множественное окно поиска Mess - «Поиск ...», отображаемый несколько раз, проблемы с оформлением

0 голосов
/ 20 марта 2020

при записи функции выпадающего списка Dynami c с использованием select2, выпадающее окно отображается странно. Ниже выводится HTML код из select2, плюс сам тэг. Версия select2 является последней на сегодняшний день, с другим (не многократным / поисковым) выпадающим на странице, работающим нормально.

Можете ли вы кто-нибудь определить, где проблема здесь? 

<div id="drp_tag_cont" class="form-group" style="display:block">
<label for="exampleInputEmail1">Tags</label> 

<select 
    id="js-example-basic-hide-search-multi" 
    multiple="" 
    data-select2-id="js-example-basic-hide-search-multi" 
    class="select2-multi-drp select2-hidden-accessible" 
    tabindex="-1" 
    aria-hidden="true" 
    name="drp_tags" 
    style="width:100%">

    <option value="1" data-select2-id="1">Landscape</option>
    <option value="2" data-select2-id="2">Abstract</option>
    <option value="3" data-select2-id="3">Marine</option>
    <option value="4" data-select2-id="4">Portrait</option>
    <option value="5" data-select2-id="5">Still Life</option>

</select>

<span 
    class=" select2 
        select2-container 
        select2-container--default 
        select2-container--above 
        select2-container--focus" 

    dir="ltr" 
    data-select2-id="1" 
    style="width: 100%;">

<span   class=" selection">

<span   class=" select2-selection 
        select2-selection--multiple" 
        role="combobox" 

    aria-haspopup="true" 
    aria-expanded="true" 
    tabindex="-1" 
    aria-disabled="false" 
    aria-owns="select2-js-example-basic-hide-search-multi-results" 

    aria-activedescendant="select2-js-example-basic-hide-search-multi-result-ts8g-1">

    <ul class="select2-selection__rendered">
    <li class="select2-selection__choice" title="Landscape" data-select2-id="8">
        <span class="select2-selection__choice__remove" role="presentation">×</span>Landscape
    </li>
    <li class="select2-selection__choice" title="Searching…" data-select2-id="9">
        <span class="select2-selection__choice__remove" role="presentation">×</span>Searching…
        </li>
        <li class="select2-search select2-search--inline">
            <input 
                class="select2-search__field" 
                type="search" tabindex="-1" 
                autocomplete="off" 
                autocorrect="off" 
                autocapitalize="none" 
                spellcheck="false" 
                role="searchbox" 
                aria-autocomplete="list" 
                placeholder="" 
                style="width: 0.75em;" 
                disabled="" 
                aria-controls="select2-js-example-basic-hide-search-multi-results" 
                aria-activedescendant="select2-js-example-basic-hide-search-multi-result-ts8g-1">
        </li>
</ul>
</span>
</span>

<span class="dropdown-wrapper" aria-hidden="true"></span>
</span>

screenshot

...