Поле со списком Kendo UI усекает начальное пространство для значений

Как мы можем отобразить начальное пространство для значения поля со списком? например.

“World”
“  America”
“     Washington”

Когда я пробую поле со списком Kendo ui, оно автоматически удаляет пробел и отображает его так:

“World”
“America”
“Washinton”

Рабочий пример был бы великолепен.


html jquery css kendo-ui kendo-combobox
person user3425106    schedule 16.03.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

На самом деле это не относится к пользовательскому интерфейсу кендо; пустое пространство схлопывается в HTML.

Вы можете использовать CSS:

.whitespace {
    white-space: pre;
}

Затем создайте свой виджет с помощью шаблона (или примените класс к элементу .km-animation-container, который оборачивает параметры):

var data = [{
    text: "Item1",
    value: "1"
}, {
    text: "   Item2",
    value: "2"
}, {
    text: "                  Item3",
    value: "3"
}];

$("#input").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: data,
    template: "<span class='whitespace'> #= data.text # </span>",
    // if you want the display value to show the white space as well, 
    // you can additionally use a value template:
    valueTemplate: "<span class='whitespace'> #= data.text # </span>"
});

(демонстрация)

person Lars Höppner    schedule 16.03.2014
comment
Большое спасибо Ларс Хоппнер - person user3425106; 19.03.2014
comment
Привет, Ларс, у меня есть еще один вопрос. Я использую поле со списком кендо внутри сетки кендо и сталкиваюсь с той же проблемой. Я пытался использовать код таким же образом, но вместо этого он показывает неопределенное значение. У меня есть такое же поле со списком для кендо со значениями countryId, countryName и CurrencyInfo, но я должен установить значение как CurrencyId и текст как countryName. Не могли бы вы помочь мне здесь? - person user3425106; 27.03.2014