Maintain viewing order of rows

Tags: #<Tag:0x00007f8b3be51118> #<Tag:0x00007f8b3be87650>

I am manually moving rows to change order, but when getting handsontable data using hotInstance.getSourceData() it is giving me the original order of rows.

Is there any way we can get viewing order of the table ?

Hi @sam

You can get the current columns order if you will get data inside afterColumnMove hook. It’s also important to use getData() instead of getSourceData() as the second will always give you the initial state. Here’s an example:

https://jsfiddle.net/aszymanski/mvwbg1L6/

Hi @adrian.szymanski,

With getData() function it will return initial state of the table but I want the updated data or I can say the latest data of handsontable for which I am using getSourceData().

My query here is I am moving rows to set particular order, for eg. there are 5 rows in table as -> 1,2,3,4,5 but I want to change order or row 3 to 1 and then save the result into database.

While fetching latest data from handsontable through getSourceData() I’m still getting records in earlier order ie. 1,2,3,4,5.
So is there any way to fetch updated order of rows with latest entered data in handsontable ?

Hi @sam

I’m sorry, I confused rows with columns. Here’s updated example, it’s basically the same but the hook used is afterRowMove:

https://jsfiddle.net/aszymanski/xa30fzks/

This way it should meet your requirements.

Hey @adrian.szymanski,

I understood the example.
But in my application I am having save button outside handsontable. Clicking on Save button I am sending data fetched through getSourceData() function to backend.
While doing this I’m not able to get correct order of rows as it gives initial order before moving the rows which causing me maintaining the user order.

Can you please help with this ?

Hi @sam

I’m not sure how your implementation exactly looks like, but I still think that getting the modified order with afterRowMove should be the best solution here.

Maybe you could prepare an example showing your implementation, and we will try to figure it out this way.

Hi @adrian.szymanski,

Sure will prepare an example of what I have implemented. Can you please create demo jsfiddle for that example in angular and share URL. I will prepare my example in the same.

Thanks.

Hi @sam

Here’s an example in Angular with the implementation of the method I mentioned earlier: https://jsfiddle.net/aszymanski/w9dp0o7e/

Hi @adrian.szymanski,

Thanks for the example, I will review and update my implementation and inform you.

Hi @sam

do we have any updates here?