I'm trying to hook up the new locked column functionality, and having some odd display behavior with my footers. It looks like the footer of non-locked columns are wrapping around underneath the locked footers instead of showing under the appropriate columns. I was able to reproduce this with the demo page by adding footer templates to the columns there (which can be seen below). Is this a bug or something that is not supported? In my case, I have some columns where I want to show the sum of the data in the footer if possible. Thanks for your help!
Regards,
Brian
Regards,
Brian
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>Frozen columns</
title
>
<
meta
charset
=
"utf-8"
>
<
link
href
=
"../../content/shared/styles/examples-offline.css"
rel
=
"stylesheet"
>
<
link
href
=
"../../../styles/kendo.common.min.css"
rel
=
"stylesheet"
>
<
link
href
=
"../../../styles/kendo.rtl.min.css"
rel
=
"stylesheet"
>
<
link
href
=
"../../../styles/kendo.default.min.css"
rel
=
"stylesheet"
>
<
script
src
=
"../../../js/jquery.min.js"
></
script
>
<
script
src
=
"../../../js/kendo.web.min.js"
></
script
>
<
script
src
=
"../../content/shared/js/console.js"
></
script
>
<
script
>
</
script
>
</
head
>
<
body
>
<
a
class
=
"offline-button"
href
=
"../index.html"
>Back</
a
>
<
div
id
=
"example"
class
=
"k-content"
>
<
div
id
=
"grid"
></
div
>
<
script
>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
ShipCountry: { type: "string" },
ShipName: { type: "string" },
ShipCity: { type: "string" },
ShipAddress: { type: "string" }
}
}
},
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,
footerTemplate: "Order ID"
}, {
field: "ShipCountry",
title: "Ship Country",
width: 200,
footerTemplate: "Ship Country"
}, {
field: "ShipCity",
title: "Ship City",
width: 160,
footerTemplate: "Ship City"
},{
field: "ShipName",
title: "Ship Name",
locked: true,
width: 200,
footerTemplate: "Ship Name"
}, {
field: "ShipAddress",
lockable: false,
width: 300,
footerTemplate: "Ship Address"
}
]
});
});
</
script
>
</
div
>
</
body
>
</
html
>