Change formatting of Grid column in response to event

[Leader]

Hello,
I have a Kendo Grid (called 'overallGrid' in my example) with some columns formatted as percentages with one decimal place ( format: "{0:p1}" ). I also have a View Model with a Select element, where the user can change what values they wish to see in the columns. What I need to do is, when they pick a certain option in the Select element, the formatting of the columns should be changed to be a decimal with 1 decimal place, rather than a percentage.

At the moment, I have this in the "click" event of a "update grid" button;

if (viewModel.score == 'Mean') {
    overallGrid.columns[1].format = '{0:n1}';
    overallGrid.columns[3].format = '{0:n1}';
}
overallGrid.dataSource.filter(  [
    { field: "score",      operator: "eq", value:viewModel.score},
]);
overallGrid.dataSource.read();
overallGrid.refresh();

When run, the formatting on the rendered grid does not change, even though I can see that the "columns.formatting" of the Grid object has been changed when I inspect the object in Firebug.

What am I doing wrong? Thanks!

[Rosen]

Hello Andrew,

I'm afraid that the column format option cannot be changed after grid initialization. However, you may achieve similar to the described functionality by using a column template to apply different formatting. Here you can find a test page which demonstrates a basic implementation.

Also as a side note, looking at the code snippet you have pasted, there is no need to call DataSource's filter, read as well as grid refresh. It is sufficient to call just filter, it will automatically trigger grid refresh.

Regards,
Rosen
Telerik