Prevent accidental closing modal before saving

[tu2-atmanand]

Various times it happens that, when a user is working on something important, and with hurry can make changes in the EditTaskModal, and without pressing save button might end up clicking outside the modal, which will close the modal and the edited content will be lost.

To solve this issue and give better user experience. I have following solution.

• If user has made any changes in the modal, keep a status variable contentEdited to detect this.
• If the contentEdited is true and user has pressed save button, make the varioable false, so user can close the modal by clicking anywhere outside the modal.
• If the contentEdited is true and user has saved the changes, and if user has clicked anywhere outside the modal, prevent modal from closing. Also open a pop-up with following message :
  There are unsaved changes.
  Do you want to save the changes ?

Then keep two buttons, Save and Discard.