Установить ширину выпадающего списка кендо пользовательского интерфейса

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

|my choice |     

Ответы на вопрос(5)

Если ваш идентификаторDropDownList являетсяmy-dropdown тогда вы должны написать:

Использование CSS

#my-dropdown-list {
    width: auto !important;
}

ПРИМЕЧАНИЕ: мы добавили-list к оригиналуid, "!важный" важно, так как вы хотите переписать оригинальное определение ширины.

Используя метод

$("#my-dropdown").data("kendoDropDownList").list.width("auto");

В дополнение к использованию"auto" для получения ширины, автоматически подгоняемой к тексту, вы можете использовать фиксированную ширину:

#my-dropdown-list {
    width: 300px !important;
}

или же:

$("#my-dropdown").data("kendoDropDownList").list.width(300);

то вы должны написать:

#my-dropdown-list {
    width: auto !important;
    -moz-min-width: 120px;
    -ms-min-width: 120px;
    -o-min-width: 120px;
    -webkit-min-width: 120px;
    min-width: 120px;
    /*max-width: 210px;*/
}

Прочитайте объяснение ниже.http://docs.telerik.com/kendo-ui/controls/editors/dropdownlist/how-to/auto-adjust-the-width

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

<input ..="" class="ExtraLarge ..
</code></pre><p>Который произвел:</p><pre><code><span style=" "="" <="" code="">

С этим классом ExtraLarge это отлично работает в FireFox и Chrome:

<code>span.k-dropdown.ExtraLarge
{
    width:400px;
}
</code>

зная, что мой выпадающий список находится внутри div.


   FirstSecond>
   

Я обнаружил, что у span есть класс k-dropdown, поэтому я добавил CSS

.myDivClass span.k-dropdown {
  width: 300px
}

о:


FirstSecond>


Вы будете инициировать kendoDropDownList с помощью jQuery следующим образом:

$("#myDropDown").kendoDropDownList().data("kendoDropDownList");

Теперь, чтобы настроить этот контроллер на полную ширину, вам нужно установить ширину элемента select на 100%, или на ваше усмотрение. например.:

<select id="myDropDown" style="width: 100%"><option>First</option><option>Second></option></select>

ИЛИ, это файл CSS:

#myDropDown { width: 100% }

Ваш ответ на вопрос