Hi there,
I have raised a support ticket about this, but am posting in the forum in case it helps other users, or they have any solutions...
--
We were hoping to use the new frozen columns in the 2014 Q1 version of the grid, but with about 10 minutes of testing using the Telerik DEMO site I managed to break the rendering.
Try either of the following:
- Multi line template in a cell
- Aggregate footer template
If you apply either of these then the rendering goes totally wrong, and this unfortunately makes this unusable for us.
If you want, you can use this HTML in the DOJO to see the problem:
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/web/grid/frozen-columns.html">
<style>html { font-size: 12px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.default.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2014.1.318/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" class="k-content">
<div id="grid"></div>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
ShipCountry: { type: "string" },
ShipName: { type: "string" },
ShipCity: { type: "string" },
ShipAddress: { type: "string" }
}
}
},
aggregate: [{ field: "ShipCountry", aggregate: "count" }],
pageSize: 30
},
height: 430,
sortable: true,
reorderable: true,
groupable: true,
resizable: true,
filterable: true,
columnMenu: true,
pageable: true,
columns: [ {
field: "OrderID",
title: "Order ID",
locked: true,
lockable: false,
width: 120
}, {
field: "ShipCountry",
title: "Ship Country",
template: " I AM BIG <br />NEW LINE",
aggregates: ["count"],
groupFooterTemplate: "#= count # orders",
footerTemplate: "#= count # orders",
width: 200
}, {
field: "ShipCity",
title: "Ship City",
width: 160
},{
field: "ShipName",
title: "Ship Name",
locked: true,
width: 200
}, {
field: "ShipAddress",
lockable: false,
width: 300
}
]
});
});
</script>
</div>
</body>
</html>
I have raised a support ticket about this, but am posting in the forum in case it helps other users, or they have any solutions...
--
We were hoping to use the new frozen columns in the 2014 Q1 version of the grid, but with about 10 minutes of testing using the Telerik DEMO site I managed to break the rendering.
Try either of the following:
- Multi line template in a cell
- Aggregate footer template
If you apply either of these then the rendering goes totally wrong, and this unfortunately makes this unusable for us.
If you want, you can use this HTML in the DOJO to see the problem:
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/web/grid/frozen-columns.html">
<style>html { font-size: 12px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.default.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2014.1.318/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" class="k-content">
<div id="grid"></div>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
ShipCountry: { type: "string" },
ShipName: { type: "string" },
ShipCity: { type: "string" },
ShipAddress: { type: "string" }
}
}
},
aggregate: [{ field: "ShipCountry", aggregate: "count" }],
pageSize: 30
},
height: 430,
sortable: true,
reorderable: true,
groupable: true,
resizable: true,
filterable: true,
columnMenu: true,
pageable: true,
columns: [ {
field: "OrderID",
title: "Order ID",
locked: true,
lockable: false,
width: 120
}, {
field: "ShipCountry",
title: "Ship Country",
template: " I AM BIG <br />NEW LINE",
aggregates: ["count"],
groupFooterTemplate: "#= count # orders",
footerTemplate: "#= count # orders",
width: 200
}, {
field: "ShipCity",
title: "Ship City",
width: 160
},{
field: "ShipName",
title: "Ship Name",
locked: true,
width: 200
}, {
field: "ShipAddress",
lockable: false,
width: 300
}
]
});
});
</script>
</div>
</body>
</html>
6 Answers, 1 is accepted
0
Hello David,
Thank you for contacting us and reporting those issues. We will do our best to have them fixed as soon as possible.
Regarding the misalignment of the footer cells you can temporary add the following CSS selector in order to avoid it:
As a token of gratitude for bringing this problem to our attention I have also updated your Telerik points.
Regards,
Nikolay Rusev
Telerik
Thank you for contacting us and reporting those issues. We will do our best to have them fixed as soon as possible.
Regarding the misalignment of the footer cells you can temporary add the following CSS selector in order to avoid it:
<style> .k-grid-footer-wrap { display: inline-block; }</style>As a token of gratitude for bringing this problem to our attention I have also updated your Telerik points.
Regards,
Nikolay Rusev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
azbola
Top achievements
Rank 1
Rank 1
answered on 25 Mar 2014, 11:22 AM
Great, thanks for your response Nikolay
0
Bryan
Top achievements
Rank 1
Rank 1
answered on 16 Jun 2015, 06:28 PM
Have there been any updates to this issue, in regards to using aggregates and locked columns in the same grid ?
0
Hello Bryan,
This issue was resolved. You can see the following demo working with Q1 2015 SP2 version - http://dojo.telerik.com/@rusev/uluzO
Regards,Nikolay Rusev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jon
Top achievements
Rank 1
Rank 1
answered on 29 Apr 2016, 05:51 PM
I'm experiencing this issue using the MVC wrappers and the ClientGroupFooterTemplate, in version 2016.1.412. When I set .Locked(true) on one or more columns, the Group Footer cells are all shifted one column to the left. If no columns are locked/fixed, the footer cells are in the correct columns. See the screenshot for an example.
0
Jon
Top achievements
Rank 1
Rank 1
answered on 29 Apr 2016, 06:04 PM
I found my issue. I had some fixed columns, but had turned scrolling off. Enabling scrolling or turning off the fixed columns both resolve the alignment issue.