14
Views
1
Comments
[Data Grid Reactive] Reorder Columns when initializing?
Forge component by Bruno Martinho
1
Published on 28 Dec 2020
Application Type
Reactive

Hi


This component will be very useful! Thanks for great work. We have two questions:

1. Our users are used to an old system where the can rearrange columns, and save the setup so that for this user the userspecific order of the column is shown also next time.

If we have this user specific set up on initilize, is it possible (or will be in he future) to reorder the column dynamically based on this data?


2. Is there any best practice to avoid user to lose changed data if the leave the page without pressing a save button? A warning letting user know that he could lose data when leaving page if "changed data" is true.


Regards

Bård

mvp_badge
MVP
Rank: #10

Hi Bård,

Let me start, by thanking you for your feedback - good and bad keep it coming!

Regarding your questions:

1. Our users are used to an old system where the can rearrange columns, and save the setup so that for this user the userspecific order of the column is shown also next time.

This feature, is still not supported, but it is in the team's radar. If possible, let the team know how important this specific feature is, and what is your timeline, so that the team can juggle priorities) - feel free to send a private message to the team.

2. Is there any best practice to avoid user to lose changed data if the leave the page without pressing a save button?

There is no "out-of-the-box" feature for that, but sounds feasible. From the top of my mind and without testing (sorry!), I believe that you can approach this in 2 ways:

  1. Implement an auto-save mechanism :) - every x seconds you'd check if there is something to save and do it.
  2. Using the onbeforeunload event - you can check if there's data left to save, and if there is, ask the user:
    window.addEventListener('beforeunload', function (e) {
       //this JS API method, enables you to see if the are unsaved changes
       if(GridAPI.GridManager.GetActiveGrid().getChangesMade().hasChanges){
          // Cancel the event
          e.preventDefault();
          // If you prevent default behavior in Mozilla Firefox prompt will always be shown
          // Chrome requires returnValue to be set
          e.returnValue = '';
       }
    });
    Taken (partially) from MDN

Hope that this helps you out.

Cheers,

RG