Dynamically Update Footer Template

[dnickels]

I have a need to dynamically update the footer template for a grid column.  There is a custom calculation that needs to be performed on data for a column and the result of the calculation should be displayed in the column footer.  The data for the grid is local.  The custom calc should be triggered and the footer should be updated immediately after the user modifies the data for a cell in the column.

I created a Kendo UI Dogo sample to illustrate what I'm trying to do.  The sample can be found at http://trykendoui.telerik.com/oVEV.  In the sample, a function named "calc" is being called by the footer template.  I'm having two problems trying to accomplish my goal right now.

1. The call to the "calc" function is wired to the save event of the grid.  However, the data source doesn't contain the latest values at the point in time that the save event callback is called.  It's as if the save event is actually a "beforeSave" event.  How do I get the updated values from the grid's data source?  Is there another event that I should be using for making the call to the "calc" function?

2. Once problem #1 is solved and the "calc" function is able to calculate the correct values, how do I display the new value in the column footer?

[dnickels]

I was able to get the calculated value to display in the footer by making a call to the grid's refresh method in the save event handler.  the updated sample is at http://trykendoui.telerik.com/oVEV/3.  The drawback is that this call messes with the default navigation.  Typically, when when clicking on a new cell, the newly clicked cell is automatically put into edit mode.  However, the call to refresh() prevents this.  The user is forced to click the cell again in order to put it into edit mode.  Yuck.  Anyone know of a more elegant solution to the problem of trying to dynamically update a column footer?

[Alexander Popov]

Hello dnickels, 

This could be achieved by replacing the text of a span drawn in the footer right after the save event handler finished. Here is an updated example that illustrates this approach.

Regards,
Alexander Popov
Telerik

 

 

[Khalid]

The above solution is working fine with the grid footer. but when I try to export the same to Excel, the value appears as below(with the HTML tags),

Total: <span id='footerPlaceholder'>5</span>

Also is it possible to do the total calculation during some other button click, rather than on grid edit.

Thanks in advance

[Alexander Popov]

Hi Khalid,

Please refer to the Grid's Excel export limitations, where possible workarounds for similar scenarios are suggested.

Regards,
Alexander Popov
Telerik by Progress