Calling kendoGrid dataSource.read() removes added class to current row

[Bjoern]

I have added a custom class to each td in a kendoGrid, to display a different color in cells that are readonly.

But when I run this: $("myGrid").data("kendoGrid").refresh();

it removes the class from the current row.

Is there a way to prevent this from happening?

[Bjoern]

I must correct my initial post.

In the .dataBound-event I run .addClass to each td in the grid, to mark certain cells with different colors.

 

In the dataSource change-event, I run this code after changing the sortorder:

var ds = $("myGrid").data("kendoGrid").dataSource;
ds.read();

The .Databound-event get triggered after ds.read(), but the css-classes is removed after the Databound-event.

Apparently some events gets triggered after the Databound-event that removes the classes.

[Tsvetomir]

Hi Bjoern,

In general, the dataBound event is the last event that is triggered after the grid has been rendered. Therefore, there are no consequent events that are forcing the grid to repaint without calling the dataBound event. 

I am not completely sure why the logic for calling the read() method inside the change event of the data source is needed. Could you share more information about this functionality? By design, the grid will perform the AJAX requests when the serverSorting is set to true. Otherwise, it would sort on the client-side. 

It would be very helpful if you could share the exact code snippets that you have used in your application so that I can use them and replicate the scenario locally. This way, I would have the chance to debug it and get back to you with the respective suggestions.

Looking forward to your reply.

 

Kind regards,
Tsvetomir
Progress Telerik

[Bjoern]

Thank you for your reply.

I have made a simple example here. https://dojo.telerik.com/@bjoler/UQaHaceL

What I want is to change the SortOrder directly in the grid, and make the grid repaint itself accordingly.

So when I change the last row's SortOrder value from 12 to 1, that row should be the first row.

 

[Tsvetomir]

Hi Bjoern,

In general, the sort is being applied only when the update in the data source has been successful. If you would like to repaint the grid after an update, you could set the autoSync property to true.

Check out the modified version here:

https://dojo.telerik.com/OseyavOs

Let me know if there is anything else I can help with.

 

Kind regards,
Tsvetomir
Progress Telerik

[Bjoern]

Please see my updated version below

[Bjoern]

Thanks again for the reply.

I have an updated versjon here:

https://dojo.telerik.com/@bjoler/AmoxOsaT

 

I've added styling to the last column. See what happens with the colour when changing the value in the last row from 12 to 1.

[Tsvetomir]

Hi Bjoern,

Thank you for the updated Dojo. Indeed, we should wrap the logic inside the dataBound event handler inside a setTimeout() function. This is needed in order to allow the grid to completely update its row and only then apply the styling. Please take a look at the following updated sample:

https://dojo.telerik.com/usilujuK

I hope you find this helpful.

 

Kind regards,
Tsvetomir
Progress Telerik