Set data-title attribute to every <td> cell

[Pantulu]

I am into customizing the display of kendo grid in mobile devices.

I need to know if I can achieve this.
I need to set the data-title={the corresponding header title} to each corresponding td cell in a column.

For example I need it this way.

<td data-title="Name" role="gridcell">Joe</td>

Any way I can achieve this ?

[Dimiter Madjarov]

Hello Pantulu,

You could achieve this in the dataBound event of the Grid by iterating the cells and retrieve the title of the corresponding column.
E.g.

.Events(e => e.DataBound("dataBound"))

function dataBound(e) {
    var grid = e.sender;
    var columns = grid.columns;
    var cells = grid.tbody.find("tr[role='row'] td");
    var currentCell, title;

    for (var i = 0; i < cells.length; i++) {
        currentCell = $(cells[i]);
        title = columns[currentCell.index()].title;
        currentCell.attr("data-title", title);
    }
}

Regards,
Dimiter Madjarov
Telerik