Prevent 'Changes Have Not Been Saved' Warning on UI Page
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-24-2025 09:18 AM - edited 06-24-2025 09:19 AM
Good morning. I have designed a UI page that contains a slushbucket. However, when selections are made, moving items from the left side to the right side, a warning is presented to the user upon clicking Submit (#approve) on the UI page. It is confusing to users as they believe they are about to lose data, when they are not.
Can anyone provide assistance on preventing this warning message from displaying when the ui page/form is submitted?
I've searched for methods of preventing the unsaved changes warning, and,
added functionality to the script to clear the right side of the slushbucket prior to submitting the form with no success.
This button triggers form submission.
HTML:
<footer class="modal-footer flex">
<button id="approve" type="submit" class="btn btn-primary">Submit Acknowledgement</button>
</footer>
Client Script:
$j('#approve').on('click', function() {
// Prevent the unsaved changes warning
top.window.onbeforeunload = null;
//Return the slushbucket to its orginal state
var rightSelect = sb.getRightSelect();
$j(rightSelect).find('option').remove();
form.submit();
});
Any assistance is greatly appreciated and thanks in advance.