Edit this page

columns.footerAttributes Object

HTML attributes of the column footer. The footerAttributes option can be used to set the HTML attributes of that cell.

HTML attributes which are JavaScript keywords (e.g. class) must be quoted.

Example - set the column footer HTML attributes

<div id="grid"></div>
<script>
    $("#grid").kendoGrid({
      columns: [
        { field: "name" },
        { field: "age",
          footerTemplate: "Min: #: min # Max: #: max #",
          footerAttributes: {
              "class": "table-footer-cell",
              style: "text-align: right; font-size: 14px"
          }
        }
      ],
      dataSource: {
        data: [
          { name: "Jane Doe", age: 30 },
          { name: "John Doe", age: 33 }
        ],
        aggregate: [
            { field: "age", aggregate: "min" },
            { field: "age", aggregate: "max" }
        ]
      }
    });
</script>

The table footer cell will look like this: <td class="table-footer-cell" style="text-align: right; font-size: 14px">Min: 30 Max: 33</td>.

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy