model.Model.save() operation doesn't complete on beforeUnload

Questions
1

When adding a model.Model.save()  function to window.unload, the save() does not complete on the server side. I tested the code in the console outside of the unload function, and the save completes as expected.

I noticed that the jQuery deferred promise object returned by the mode save function remains in a ‘pending’ state forever. Why would this be?

Is there a fix?




Code is below if you want to reproduce the issue.

<br><br>(function(skuid){ var $ = skuid.$;<br>$(document.body).one('pageload',function(){<br>$(window).unload(function(){<br>&nbsp; &nbsp; &nbsp; &nbsp; try{<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; removeUnfinishedRows();<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; &nbsp; &nbsp; catch(e){<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(e);<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; debugger;<br>&nbsp; &nbsp; &nbsp; &nbsp; });<br><br>});<br>})(skuid);<br>function removeUnfinishedRows(){<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; var rowsToCheck = skuid.model.getModel('SubmissionsForSelectedBanks');<br>&nbsp; &nbsp; var rowsToCheckData = rowsToCheck.data;<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; //cancel changed since save() needs to be called in order to delete rows.<br>&nbsp; &nbsp; //if save is called and changes aren't cancelled, some unintended changes may occur.<br>&nbsp; &nbsp; rowsToCheck.cancel();<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; //iterate thru each submission in the model that creates submissions and make sure that they've been sent<br>&nbsp; &nbsp; //if they haven't been sent, mark them for deletion<br>&nbsp; &nbsp; rowsToCheckData.forEach(<br>&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; function(element,index,array){<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; rowToCheckTemp = rowsToCheckData[index];<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(!rowToCheckTemp.Custom_Relationship__r.Form_Is_Incomplete__c){<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; rowsToCheck.deleteRow({ Id: rowToCheckTemp.Id });<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; );<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; savePromise = rowsToCheck.save();<br>&nbsp; &nbsp; console.log(savePromise); //this prints 'pending'<br>//only uncomment if you want your tab to crash. This while loop goes on forever<br>&nbsp; &nbsp; /*while(savePromise.state()=='pending'){<br>&nbsp; &nbsp; &nbsp; &nbsp; //do nothing... wait until promise is done failing or resolving<br>&nbsp; &nbsp; }*/<br>&nbsp; &nbsp;&nbsp;<br>}
2

The resolution was to change when my function would fire. Instead of using $window.unload, use

$window.on(‘beforeunload’,function(){})


http://stackoverflow.com/questions/6895564/difference-between-onbeforeunload-and-onunload