Kendo DropDownList 搜索模板修改文本

Question

我无法获取 Kendo DropDownList 的内置搜索以使用模板化文本而不是来自数据源的原始文本。为了显示、值和搜索目的，我想从数据源名称中去掉前导斜杠。

<script>
$("#dropdownlist").kendoDropDownList({
  dataSource: [ "/Apples", "/Oranges" ],

  // None of these templates appear to fix the search text.  
  // Kendo is using the dataSource item to search instead of the template output.
  // I want to be able to search using 'a' (for Apples) or 'o' (for Oranges).  
  // If I use '/' then it cycles through the items which proves to me that the search is not using templated text.

  template: function(t) { return t.name.slice(1); },
  valueTemplate: function(t) { return t.name.slice(1); },
  optionLabelTemplate : function (t) { return t.name.slice(1); },

});
</script>

这是 Kendo 的 UI 测试器中的一个非工作示例：

http://dojo.telerik.com/@Jeremy/UvOFo

我无法轻易更改服务器端的数据源。

如果无法更改搜索的工作方式，那么也许有一种方法可以在从服务器加载到客户端后更改数据源？

Answer 1

我不确定这是否对您有帮助，但我能够强制它工作。该控件允许您在 init 上订阅过滤事件。在这里，您可以在提交之前设置过滤器的值。

<script>
$("#dropdownlist").kendoDropDownList({
    dataSource: ["/Apples", "/Oranges"],
    template: function(t) { return t.slice(1); },
    valueTemplate: function(t) { return t.slice(1); },
    optionLabelTemplate : function (t) { return t.slice(0); },
    filter: "startswith",
    filtering: function(e) {
        e.filter.value = '/'+e.filter.value;
    }
});
</script>

Kendo DropDownList 搜索模板修改文本

Kendo DropDownList Search on template modified text

kendo-ui

telerik

kendo-dropdown