Edit this page

columns.headerAttributes Object

HTML attributes of the column header. The grid renders a table header cell (<th>) for every column. The headerAttributes option can be used to set the HTML attributes of that th.

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

Example - set the column header HTML attributes

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [{
    field: "name",
    headerAttributes: {
      "class": "table-header-cell",
      style: "text-align: right; font-size: 14px"
    }
  }],
  dataSource: [ { name: "Jane Doe" }, { name: "John Doe" } ]
});
</script>

The table header cell will look like this: <th class="table-header-cell" style="text-align: right; font-size: 14px">name</th>.

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

Give article feedback

Tell us how we can improve this article

close
Dummy