In the project I’m working on, we use jqGrid to display hierarchical records in an Excel-like manner. Changes are queued up on the client and submitted to the server whenever the user clicks the “Save” button. That means a user could make a bunch of changes, then navigate away from the page accidentally, and lose everything they just did. Preventing that is easy enough though, just use this JavaScript snippet:
1: window.onbeforeunload=checkForChanges;
2: function checkForChanges(){
3: var rows = $('#treeTable').getChangedCells('all');
4: if (rows != null && rows.length > 0) {
5: return 'You have unsaved changes that will be discarded.';
6: }
7: };
The checkForChanges function is bound to the onbeforeunload event, which is fired whenever the browser window is about to change the page. This includes page reload/refreshes or anything like that. The checkForChanges function uses the jqGrid getChangedCells method to see if there are any unsaved changes. If there are, it returns a message that will be shown automagically in a JavaScript confirm dialog. If there aren’t, it doesn’t return anything, and the user is allowed to navigate without being nagged.
Share or Bookmark this post…