更改列标题Treelist KendoUI

时间:2019-08-03 10:07:32

标签: kendo-ui telerik kendo-treelist

我希望能够更改由年选择器onChange动态触发的列标题,但是我找不到合适的样式来处理它。

我试图通过对inspect元素进行检查来进行修改,但是它也没有起作用。

enter image description here

我的代码:

      $("#monthpicker").kendoDatePicker({
            start: "year",
            depth: "year",
            format: "yyyy",
            dateInput: true,

            change: function() {
                    var year = kendo.toString($("#monthpicker").data("kendoDatePicker").value(), 'yyyy');
                    $("#treelist").data("kendoTreeList").dataSource.read({start: year});
                    $(".k-grid-header th.k-header:first-child").text(year);

            }
        });

应该是这样的: (只需在“月份”列上方的列标题上进行更改)

enter image description here

有人对此有经验吗?谢谢。

1 个答案:

答案 0 :(得分:0)

您的查询.k-grid-header th.k-header:first-child选择了错误的标题。

我建议使用带有占位符的headerTemplate,例如:

headerTemplate: function(x) { 
    return '<span class="year-goes-here"></span>'
}

然后通过以下方式设置年份:

$("#treelist").find(".year-goes-here").text(2018)

工作示例:https://dojo.telerik.com/uXuwIDeK