Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.25k stars 526 forks source link

2 DataGrid Sync #4813

Open PatTheLad opened 1 year ago

PatTheLad commented 1 year ago

Is there any way to sync two datagrids together?

stsrki commented 1 year ago

Synced scrolling

Scrolling is not possible out-of-the-box. You could probably do it with some custom JS.

Synced page switch

This is possible to do. You need to bind the page number to the same variable and propagate it to DataGird with the CurrentPage parameter.

@David-Moreira

PatTheLad commented 1 year ago

Sounds promising. Im gonna give it a try as soon as I can. Thanks for the fast reply!

David-Moreira commented 1 year ago

@PatTheLad @stsrki Actually we do have scrolling apis on the DataGrid, if you're using Virtualize or FixedHeader feature. You should be able to call it on both grids and also sync it up.

image

as the ScrollToRow expects a row index, you can also use this helper, SelectedRowIndex: image

Edit: But to answer your original question, syncing is not supported out of the box, you will always have to make sure that whatever is bound to both grids is the same Parameter or call whatever syncing mechanism you come up with in both grids.

David-Moreira commented 1 year ago

This issue might be interesting to track, https://github.com/Megabit/Blazorise/issues/4651 We'd like to come up with some kind of centralized state api. It would make it much easier to check the grid state, load it from some saved state, etc...

PatTheLad commented 1 year ago

Awesome! Is there any way you can also sync the filters if you are using the same data for both datagrids? Or should i just write a custom filter method?

David-Moreira commented 1 year ago

Hello,

I don't think that's an easy one, if you mean to actually display / sync up the bound filter text on both grids and all. You will have to come up with a custom implementation.