Geek Answers Handbook

Kendo UI: Failed to add footerTemplate to the grid

I am trying to display a field counter in footerTemplate. Follow the violin:

http://jsbin.com/ajoyug/8/edit

However, without footerTemplate, it works great. But as soon as I add footerTemplate, it stops working.

Inside the aggregateResult object, I get the value count. But how should I add it to footerTemplate?

Please help me.

Thanks!!

+4
source share
2 answers

I could not explain why it does not work. But I tried to make your example a different way, and it works well.

Here's a link.

http://jsbin.com/ajoyug/35/edit

+1
source

The problem is your approach when the grid is rendered twice, the first time on the Kendo UI init user interface (implicit during the first bind ), and the second when you bind actual data.

The first time the data is still unavailable, and then it fails.

If you want to follow this path, you must:

 <div id="myListView" data-role="grid" class="transaction-grid" data-columns="[ { field: 'name', title: 'Name', width:'20%' }, { field: 'age', title: 'Age' , width:'35%', footerTemplate: 'Total Count: # if (data.age) { # #= age.count # # } #' } ]" data-bind="source: dataSource"> </div>

i.e. check if data.age is available and then when printing. A.

Otherwise, I recommend the following @UmankantPatil suggestion and do not use data-* , but JavaScript to initialize widgets and binding data.

Check it out in a modified version of your JSBin here

+2
source

More articles:


All Articles