-2

我发现下面的代码会导致“TypeError: (intermediate value).toLowerCase is not a function”,这似乎是由工具栏模板定义引起的,但相同的工具栏定义在剑道网格中工作正常

$(document).ready(function(){
    $("#treelist").kendoTreeList({
        columns: [
            { field: "Name" },
            { field: "Position" }
        ],
        dataSource: {
            data: [
                { id: 1, parentId: null, Name: "Jane Smith", Position: "CEO" },
                { id: 2, parentId: 1,    Name: "Alex Sells", Position: "EVP Sales" },
                { id: 3, parentId: 1,    Name: "Bob Price",  Position: "EVP Marketing" }
            ],                
        },
        toolbar: [
            { template: '<a class="k-button" onclick="customSave(this)" href="\\#"><span class="k-icon k-i-tick"></span>custom save</a>' },
            { template: '<a class="k-button" onclick="customCancel(this)" href="\\#"><span class="k-icon k-i-cancel"></span>custom cancel</a>' }
        ]
    });
});

有没有办法解决这个问题?(必须保留按钮图标)

4

2 回答 2

1

使用单击处理程序创建工具栏的正确方法是:

toolbar: [
    {
        name: 'custom',
        text: 'custom save', 
        imageClass: 'k-i-tick', 
        click: customSave
    }, 
    {
        name: 'custom',
        text: 'custom cancel', 
        imageClass: 'k-i-cancel', 
        click: customCancel
    },
]

它是如何工作的:

  • name必须是custom,因为它不是内置命令。如果省略此属性,您将收到错误消息。
  • text:您想在按钮上显示的任何内容
  • imageClassclass您要显示的图标的 (k-icon隐含)
  • click: 事件处理程序

我创建了一个 jsFiddle 来说明:https ://jsfiddle.net/ueL8mrcr/

于 2018-04-13T09:05:03.523 回答
1

搜索文档后,我找到了解决方案,希望它可以帮助遇到同样问题的人。

据此:_

如果将 String 值分配给工具栏配置选项,它将被视为整个树列表 Toolbar 的单个字符串模板,并且该字符串值将作为参数传递给 kendo.template() 函数。如果是 Function 值被赋值(可能是 kendo.template() 函数调用或泛型函数引用),则函数的返回值将用于渲染树形列表工具栏内容。如果赋值为 Array 值,则将其视为树列表工具栏中显示的命令列表。

所以我改变了这个:

toolbar: [ createToolBar ] 

添加功能:

function createToolbar() {
    return [
        '<a class="k-button" href="#" onclick="customSave(this)"><span class="k-icon k-i-tick"></span>custom save</a>',
        '<a class="k-button" href="#" onclick="customCancel(this)"><span class="k-icon k-i-cancel"></span>custom cancel</a>'
    ];
}

然后它工作。

正如参考资料所说,如果我将返回字符串数组直接放入工具栏配置,它将将该数组呈现为两个剑道按钮,然后图标将丢失。

而在这种情况下'href=\\#'应该改为'href=#',否则它会采取重定向动作,我不知道原因。

于 2018-04-13T07:13:55.643 回答