Dynamic Grid Columns and Aggregate Function

5 posts, 0 answers
  1. Abdullah Önden
    Abdullah Önden avatar
    20 posts
    Member since:
    Aug 2009

    Posted 04 Feb 2010 Link to this post


    I have a Grid which generates its columns automatically. Grid's column counts changes with SQL. How can I add aggregate
    function to these dynamic columns? I'd like to show these in footer. Where should I control it, onitemdatabound or something?

  2. Tsvetoslav
    Tsvetoslav avatar
    1823 posts

    Posted 05 Feb 2010 Link to this post

    Hello Abdullah,

    Each auto-generated column causes the grid to trigger its ColumnCreated event where you can access the column (e.Column) and set its Aggregate function.

    I hope this helps.

    Best wishes,
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
  3. Marc Roussel
    Marc Roussel avatar
    429 posts
    Member since:
    Dec 2009

    Posted 15 Apr 2011 Link to this post


    Could you explain how I have this agregatefunction SumFunction in the Group Footer of the column which is a monetary column
    I should see something like $200 since I have 2 rows with the $100 each

    I tried this but there's nothing shown on the GROUP FOOTER

    void rgvTest_AutoGeneratingColumn(object sender, Telerik.Windows.Controls.GridViewAutoGeneratingColumnEventArgs e)
        if(e.Column.UniqueName == "Property2")
            e.Column.AggregateFunctions.Add(new SumFunction() { Caption = "", ResultFormatString = "C2" });
  4. Vipul
    Vipul avatar
    1 posts
    Member since:
    Mar 2016

    Posted 22 Mar 2016 Link to this post


    Here is the complete code for dyanmic grid with dynamic column and aggregate.

                    url: ",
                    datatype: "JSON",
                    type: "GET",
                    success: function (result) {
                        var items = $.parseJSON(result)[0];
                        var arrCol = [];
                        var arrAgg = [];
                        for (var index in items) 
    arrCol.push({ field: index, format: "{0:0}", aggregates: ["sum"], footerTemplate: "#= kendo.toString(sum, '0.00') #" });
    arrAgg.push({ field: index, aggregate: "sum" });
                        if (result.Result.length > 0) {
                            var dataSource = new kendo.data.DataSource({
                                data: $.parseJSON(result.Result),
                                group: { field: "Category" },
                                aggregate: arrAgg
                                dataSource: dataSource,
                                height: "auto",
                                scrollable: false,
                                sortable: true,
                                groupable: false,
                                columns: arrCol



  5. Ravi
    Ravi avatar
    1 posts
    Member since:
    Jul 2010

    Posted 13 Dec 2017 in reply to Vipul Link to this post

    <!DOCTYPE html>
        <meta charset="utf-8">
        <title>GCI Kendo UI R & D</title>

        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.common.min.css">
        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.rtl.min.css">
        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.default.min.css">
        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.dataviz.min.css">
        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.dataviz.default.min.css">
        <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.2.805/styles/kendo.mobile.all.min.css">

        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://kendo.cdn.telerik.com/2015.2.805/js/kendo.all.min.js"></script>
    <div id="grid"></div>
     <div id="dialog" style="display:none">
     <input type="checkbox" name="summary" id="ch1" checked value="sum" /> Sum
     <input type="checkbox" name="summary" id="ch2" checked value="count" /> Count
     <input type="checkbox" name="summary" id="ch3" value="average" /> Average
     <input type="checkbox" name="summary" id="ch4" checked value="min" /> Min
     <input type="checkbox" name="summary" id="ch5" checked value="max" /> Max
     <button id="clkok">  OK</button>

    var locations = [
        "id": 1,
        "name": "Maui",
        "country": "USA",
    "description": "The second largest Hawaiian island and is known as the Valley Isle",
    "imagePath": "content/images/locations/maui.jpeg",
        "votes": 20
        "id": 2,
        "name": "Dubai",
       "country": "UAE",
        "description": "Dubai is a business and cultural center for the middle east",
        "imagePath": "content/images/locations/dubai.jpeg",
        "votes": 18

    var dataSource =  new kendo.data.DataSource({
    data: locations,
    aggregate: [
    { field: "country", aggregate: "average"}

    var fieldval='';

    var field=fieldval;
    var lnColIndex = eval('$($("[data-field='+ field +']")[0]).attr("data-index")');
    var lbAggExists=false;
    if (dataSource.aggregate().length>0)
    for(var lnAgg=0;lnAgg<=dataSource.aggregate().length-1;lnAgg++)
    if (dataSource.aggregate()[lnAgg].field == field){
    if (lbAggExists==false) {
    dataSource.aggregate().push({ field: field, aggregate: "count" });
    dataSource.aggregate().push({ field: field, aggregate: "min" });
    dataSource.aggregate().push({ field: field, aggregate: "max" });
    dataSource.aggregate().push({ field: field, aggregate: "sum" });
    var lsSumText=" Count : "  + eval("dataSource.aggregates()."+field+".count");
    lsSumText += " Min : "  + eval("dataSource.aggregates()."+field+".min");
    lsSumText += " Max : "  + eval("dataSource.aggregates()."+field+".max");
    lsSumText += " Sum : "  + eval("dataSource.aggregates()."+field+".sum");

    loAggJSON.push({ "colindx": lnColIndex, "coltext": lsSumText });
    if (loAggJSON.length>0)
    for(var lnAgg=0;lnAgg<=loAggJSON.length-1;lnAgg++)

    else {

    var loAggJSON=[];

        dataSource: dataSource,
        columns: [
    { field: "id",title: "ID"},
            { field: "name",title: "Name"},
    { field: "country",title: "Country"},
    { field: "description",title: "Description"},
    { field: "votes",title: "Votes"},
    columnMenu: true,
        columnMenuInit: function (e) {
            var menu = e.container.find(".k-menu").data("kendoMenu");
            var field = e.field;
                text: "Summary"
            menu.bind("select", function (e) {
                var menuText = $(e.item).text();
                if (menuText == "Summary") {


Back to Top