I am using the Presaveaction() to perform pre-new/edit form validation. Once all fields have been validated successfully I would like to offer my users the ability to 'Save and Exit' or 'Save and Continue'.

I am presenting this option to them using the SP.UI.ModalDialog.showModalDialog() method as I would like a better UX than using a native js 'prompt' function (as used here: How to include a 'yes' and 'no' button on the PreSaveAction() on the EditForm.aspx to return true/false accordingly?).

My validation works fine, as does the display of my modal dialog, but the presaveaction() function is completing (and creating/saving the list item) before I have a chance to press either button.

How can I make the presaveaction() function wait for my dialog response?

My code snippet is shown below:

if ($inBranchEventOK === false || $injOccOK === false){  //checks field values
    return false //returns false to prevent save
} else {
    displayCompleteRequest() //calls confirmation modal popup
//other stuff here
    return true
};//end if

function displayCompleteRequest(){

//function openDialog()
    var $confmsgtext = "<p>You have entered all the information required for this stage.</p><p>Do you with to progress to the STAGE NAME stage?</p><p> Click 'Continue' to progress to the STAGE NAME stage or 'Save and Close' if you intend to update this information further</p><button type ='button' onclick='updateStatus()'>Continue</button><button type ='button' onclick='closeDialog()'>Save and Close</button>"; //formats dialog content
    $("#compreqcontent").append($confmsgtext); // appends to DOM

    var dialogTitle = "Do you wish to complete this stage?";
    var options = SP.UI.$create_DialogOptions();
    options.title = dialogTitle;
    options.width = 1000;
    options.showClose = false;
    //options.height = 250;
    //options.autosize = true;
    options.html = createDialogElement();
    options.dialogReturnValueCallback = closeDialog;


function createDialogElement() { //displays dialog
    var dialogElement = $($('#compreqdiv').html());
    return dialogElement.get(0);

function closeDialog(){
    //return true
}//end closeDialog


function updateStatus(){ //sets status field value based on required conditions.  
var $injOccText = $("[fgid='fg_injOcc']").val();

if ($injOccText !== 'Yes'){
} else {


What I would like is for the updateStatus function to complete and the modal dialog close before the presaveaction function completes.

1 Answer 1


I think that there is no way to make the PreSaveAction function wait for a result from the Dialog. The only thing that you can do is to manually trigger the form postback, like this:

if ($inBranchEventOK === false || $injOccOK === false){  //checks field values
return false; //returns false to prevent save
} else {
    displayCompleteRequest() //calls confirmation modal popup
    //always return false from your PreSaveAction function
    return false;

function closeDialog(){

function triggerPostback(){
    var saveButtonName = $('input[name$="SaveItem"]').attr('name');
    WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(saveButtonName, "", true, "", "", false, true));  
  • 1
    Got this working as required, but only after an hour or two of head-scratching due to the incompatibility of using FF and "use strict" mode globally with this approach.
    – Fairfield
    Commented Jan 13, 2014 at 23:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.