Hi, how to create "Drag and drop" feature to move the table row in Reactive web?
Thanks~~
Hi Jia,
You can try using the Outsystems Data Grid which supports drag and drop reordering the rows out of the box. Give it a try to see if it supports the use cases required in rest of your grid/table.
Let me know if you're not willing to change your widget. There can be another solution to it but more complex and custom made.
Hi Ravi Punjwani,
I want to continue with my widget. May I know what method and how can I create the drag and drop in the table row? Thanks
While it is not recommended by Outsystems to modify the HTML DOM directly using your own script, you can continue if you want to take risk. That may come with unexpected consequences.
https://success.outsystems.com/Documentation/Best_Practices/Development/OutSystems_Mobile_Best_Practices
Please suggest me what would you do in following scenarios, before I can send you a solution on reordering the table records by drag and drop.
What would happen to the data bound to your Table? Do you want to update the data variable as well? It might be some more effort if you want to achieve that too. How the table should behave when it has paging / sorting on that table?
Let me know what you think about these options. I don't have a readymade script to apply, but I can make it for you depending on how you want it to behave.
Hint: If you want to do it yourself, here's a quick guide on implementing your own drag and drop. Just include the required script and get it going. You might want to trigger an event on your Table when the user drops a row which brings some changes on the UI or data.
If this is only for the educational purposes, it's probably not worth spending that much amount of time on this feature.
Hi @Jia Wen Loo ,
Hope you are keeping well !
If I get your query correct, you want to drag and drop the rows in a sortable manner and should be able to save the same.
This can be easily achieved using JS. But for more efficiency and quick approach I would suggest using this forge component.
https://www.outsystems.com/forge/component-overview/11549/sortable-drag-and-drop
Thanks,
Aditya
Hello
There are some Forge Components available that can help you with this functionality with them demos are also available so that you have a good understanding on it,
Reactive
Traditional
Hope this helps
Thanks & RegardsTousif Khan