How to get griditem index position after re-positioning & how to programatically/manually change griditem position/order

[amit509]

Hi,

How to get griditem index position after re-positioning & how to programatically/manually change

Can anyone help me out ??

[swiety85]

Hi, it depends on how you understand the index position of the items? From left to right and then next row etc.? Do your all items have the same size? In general you can calculate the index out of the gridster item coordinates.

[amit509]

Do your all items have the same size? - No. Can you help me out to calculate the index out of the gridster item coordinates? If possible please provide an example or snippet.

Thanks in advance.

[amit509]

Hey Swiety85 can you please help me out on this?

[swiety85]

Calculate the index out of the gridster item coordinates:

items
  .sort((prev, next) => prev.x !== next.x ? prev.x - next.x : prev.y - next.y)
  .map((item, index) => ({item, index}))

[amit509]

Hey thanks for your quick reply. I have tried your solution, index is appended as 0, 1, 2, 3, 4. But after dragging object 2 to position 0 doesn't update the index position. When we drag and drop widget to another position its index position should be changed but it is not changing. I think i am missing something. Please look into the below example. stackblitz

[swiety85]

You use responsiveOptions with different item coords in different breakpoints. First of all you should get rid of responsiveOptions from your config to have always the same gridster positions (x, y) in every resolution. Then it should work. :)

[SunilManthenaG01]

I have a similar issue as well @swiety85. The only way I can remove my responsive options is when the gridster items can wrap down when it does not space for the item. Is there any way we can do that?