KendoUI Grid custom footer using two or more column with MVC wrapper - kendo-ui

Question

I have a Kendo Grid and want to use two column to crete a ClientFooterTemplate (Value2).
So, I have :
#(Html.Kendo().Grid<MyGridDto>().Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.Value1)
.ClientFooterTemplate("#= sum #");
columns.Bound(p => p.Value2);
.ClientFooterTemplate ( HERE I WANT TO GET SUM OF VALUE3 / SUM VALUE 2)
columns.Bound(p => p.Value3).Visible(false);
}
.DataSource(dataSource => dataSource
.Ajax()
.Aggregates(aggregates =>
{
aggregates.Add(p => p.Value1).Sum();
aggregates.Add(p => p.Value2).Sum();
aggregates.Add(p => p.Value3).Sum();
})
.Read(read => read.Action("List", "MyController)) )
)
MyGridDto
public class MyGridDto
{
public decimal Value1 { get; set; }
public decimal Value2 { get; set; }
public decimal Value3 { get; set; }
}
I want to show the Value2 footer using sum of Value3 / Sum of Value2. How can I do that?
Thanks

Answer 1

You can achieve this by getting the value of the ValueComputed into a temp variable on datasource request end and adding the footer row in as below:
<div class="k-grid k-widget">
<table class="k-focusable" id="totals" >
<tr>
<td/>
<td/>
<td>
Total price: <span data-bind="text: priceTotal" />
</td>
</tr>
</table>
</div>
Please see the below example for more info:
Kendo UI Grid With Table Footer by Darren Bell
You might need to create the Data Source sepearately and will have to bind viewmodel once Data Source is created.
EDIT:
As per your update, I have created an working sample for your reference using same logic as per the previous table footer example. Please find the working example at below link:
Kendo UI Grid Custom Calculated Footer
Do let me know if this is not what you are looking for!
Edit 2:
Client Footer only