Spreadsheet Partial DataSource Update With Set() Slow

1 Answer 11 Views
Data Source Spreadsheet
Sarah
Top achievements
Rank 1
Sarah asked on 28 Jun 2021, 06:12 PM | edited on 29 Jun 2021, 03:16 PM

I am using the spreadsheet component and need to partially update my datasource from the server prior to submit.

Basically I have 350 rows in the spreadsheet. I send some (those that have been edited) to the server via ajax where some additional fields are populated. Then those records are sent back to the client side and the user keeps editing before submitting later. On Ajax success I need to update my datasource based on the changes from the server.

Currently in js I am looping through the returned rows, finding them in the datasource, and updating each cell with the new value from the server using datasource.set(). The problem is that this is extremely slow for a few hundred rows. I found this forum answer that is very similar to my situation, except this person is using the grid instead of the spreadsheet.

https://www.telerik.com/forums/modifying-datasource-values-is-very-slow-with-bigger-data-sets

I tried setting my cell values with = instead of set() and then calling $("#spreadsheet").data("kendoSpreadsheet").refresh(); but the spreadsheet rows are not redrawn, even though datasource is reflecting the updated values. I can't use dataSource.sync() because the rows aren't ready to be submitted. I've also tried using dataSource.pushUpdate(<returned from server rows>) which works, but clears out all of the dirty flags by design, meaning I'd need to reset them manually (also slow).

Are there any other options for doing a partial update of a datasource quickly and maintining dirty flags?

 

 

1 Answer, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 01 Jul 2021, 12:02 PM

Hello Sarah,

Unlike the Grid, the Spreadsheet refresh method will not force DataSource to rebind. Having that said, you should instead manually trigger the change event of the DataSource:

var spread = $("#spreadsheet").getKendoSpreadsheet();
var ds = spread.activeSheet().dataSource;
ds.data()[0].ProductName = "test";
ds.trigger("change");

Here is a small Dojo sample implementing the above suggestion:

https://dojo.telerik.com/EgAnUDiy

Regards,
Veselin Tsvetanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
Data Source Spreadsheet
Asked by
Sarah
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Share this question
or