我正在尝试将自定义hovertext(如工具提示)添加到KendoUI网格中的列标题中.文本应特定于每列,理想情况下不显示在标题行之外的任何内容上. Grid对象没有工具提示选项,但我不确定是否可以使用CSS或其
row template配置来执行此操作.
有兴趣听听是否有人之前已经这样做过,如果有的话,或者如果有可能的话.
谢谢.
解决方法
如果工具提示的内容是静态的,那么您可以使用
columns.headerTemplate然后在标题中添加
tooltip.
代码：
$("#grid").kendoGrid({
dataSource: {
type: "odata",transport: {
read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
},schema: {
model: {
fields: {
OrderID: {
type: "number"
},Freight: {
type: "number"
},ShipName: {
type: "string"
},OrderDate: {
type: "date"
},ShipCity: {
type: "string"
}
}
}
},pageSize: 20,serverPaging: true,serverFiltering: true,serverSorting: true
},height: 430,filterable: true,sortable: true,pageable: true,columns: [{
field: "OrderID",filterable: false
},"Freight",{
field: "OrderDate",title: "Order Date",width: 120,format: "{0:MM/dd/yyyy}",headerTemplate: '<span title="This is the date the order was made.">Order Date</span>'
},{
field: "ShipName",title: "Ship Name",width: 260,headerTemplate: '<span title="The company the order was shipped to.">Ship Name</span>'
},{
field: "ShipCity",title: "Ship City",width: 150,headerTemplate: '<span title="The city the order was shipped to.">Ship City</span>'
}]
});
$("#grid").kendoTooltip({
filter: ".k-header span"
});
