[英]Change column header Treelist KendoUI
I want to be able to change my column header dynamically triggered by year picker onChange, but I can't find the proper style to handle it. 我希望能够更改由年份选择器onChange动态触发的列标题,但找不到合适的样式来处理它。
I've tried to modify with a check on the inspect element, but it also didn't work. 我尝试通过检查检查元素进行修改,但是它也没有起作用。
And my code: 而我的代码:
$("#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);
}
});
And it should be like this: (just change on the column header above Month column) 它应该像这样:(只需在Month列上方的列标题上进行更改)
is there anyone experienced with this? 有没有人对此有经验? Thanks.
谢谢。
Your query .k-grid-header th.k-header:first-child
is selecting the wrong headers. 您的查询
.k-grid-header th.k-header:first-child
选择了错误的标题。
I propose using a headerTemplate with a placeholder, for instance: 我建议将headerTemplate与占位符一起使用,例如:
headerTemplate: function(x) {
return '<span class="year-goes-here"></span>'
}
And then set the year via: 然后通过以下方式设置年份:
$("#treelist").find(".year-goes-here").text(2018)
Working example: https://dojo.telerik.com/uXuwIDeK 工作示例: https : //dojo.telerik.com/uXuwIDeK
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.