Notify user about unsaved changes – Lightning Component

Notify user about unsaved changes – Lightning Component

A user has just filled 20+ input boxes in your Lightning component and accidentally refreshed the page (that command+R can be tricky),  feel the frustration of the user in this case. Well lightning:unsavedChanges is here for our rescue.

In Spring19, Salesforce has introduced new Lightning component “lightning:unsavedChanges” which can help us notify the user about unsaved changes in case of page refresh or page close.

Check out below example:

  • In this example, the user will have 2 input boxes, if the user inserts any value in these input boxes and reload the page, the browser will show an alert box to confirm the change.
  • If the user clicks on the save button, then the browser will not show any alert.

Component File

https://gist.github.com/f98da573f3b5abfdfc9fb48ee79c39ea

Controller File

https://gist.github.com/6a2191567f7c27363baff9f27c7b89dd

Helper File

https://gist.github.com/58805e3d0ee31a4177379210568340d5

Output:

Manish Choudhari

I am a certified Salesforce Application & System Architect and Developer working on Salesforce Technology since 2014. Currently, I have 14 Salesforce certifications along with OCPJP (Oracle Certified Profession JavaSE6 Programmer) working in Salesforce.com Hyderabad as a Technical Engineer. Writing technical blogs, learning new technologies and frameworks and sharing knowledge is my hobby.

Leave a Reply

Close Menu