Question

我们如何显示组合框值的初始空间？例如

“World”
“  America”
“     Washington”

当我尝试使用Kendo ui组合框时，它会自动删除空格并显示如下：

“World”
“America”
“Washinton”

一个工作的例子会很棒。

Answer 1

这实际上并非特定于Kendo UI;空格在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>"
});

（demo）

Kendo UI组合框截断值的初始空间

1 个答案: