[英]Kendo - Grid - Aggregate Footer Column Alignment
I have a Kendo Grid that has a footer template to show aggregate data. 我有一个具有页脚模板的Kendo网格,以显示汇总数据。 The aggregate data initially aligns with its column (just as it should).
汇总数据最初会与其列对齐(恰如其应)。 However, if I hide a column and the columns have different widths, the aggregate data becomes misaligned with its column.
但是,如果我隐藏一列并且这些列具有不同的宽度,则聚合数据将与其列不对齐。 Here's the fiddle: http://jsfiddle.net/uQG2J/1/
这是小提琴: http : //jsfiddle.net/uQG2J/1/
Here's the code: 这是代码:
var grid = $("#grid").kendoGrid({
dataSource: {
data: [
{"foo": 10, "bar": 10, "moo":5},
{"foo": 20, "bar": 30, "moo":8},
],
aggregate: [
{field: "moo", aggregate: "sum"}
]
},
columns: [
{
field: "foo",
width: 20
},
{
field: "bar",
width: 80
},
{
field: "moo",
footerTemplate: "Sum: #=sum# ",
width: 40
}
]
}).data("kendoGrid");
grid.hideColumn("foo");
grid.refresh();
How can I align the aggregate data with its column after hiding another column? 隐藏另一列后如何将聚合数据与其列对齐?
To avoid this set the width of the columns in percents. 为避免这种情况,请以百分比设置列的宽度。
eg 例如
var grid = $("#grid").kendoGrid({
dataSource: {
data: [
{"foo": 10, "bar": 10, "moo":5},
{"foo": 20, "bar": 30, "moo":8},
],
aggregate: [
{field: "moo", aggregate: "sum"}
]
},
columns: [
{
field: "foo",
width: "20%"
},
{
field: "bar",
width: "20%"
},
{
field: "moo",
footerTemplate: "Sum: #=sum# ",
width: "60%"
}
]
}).data("kendoGrid");
//grid.hideColumn("foo");
grid.refresh();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.