Question

I am using jQueryUI to make a confirmation popup to save. I am writing a finishing function for when the user is done editing everything. The popup comes up and the rest of the finishing function goes on before the confirmation is selected “don’t save” “save” or “cancel”. I am using the confirmation several times, so I can’t change that specifically for this instance.
How do I make the function wait for the results of the confirmation?

    $("#dialog").dialog({
            autoOpen: false,
    modal: true,
    title: 'Save Changes',
    buttons: {
        "Don't Save": function() {
            setDivText();
            $( this ).dialog( "close" );
        },
        Cancel: function(){
            $("#selection option:selected").removeAttr("selected");
            $.each($("#selection option"), function(){
                if($(this).val() == prevSel){
                    $(this).attr('selected', 'selected');
                }
            });
            $(this).dialog("close");
        },
        "Save": function(){
            organizedDivs[prevSel][2] = tinyMCE.activeEditor.getContent();
            setDivText();
            $(this).dialog('close');
        }
    }
});

and

function output(){
if(tinyMCE.activeEditor.isDirty()){
    $("#dialog").dialog('open'); 
    saveAll();
} else {
    saveAll();
}
}

and

function saveAll(){
$.each( fileText.match( /<div.*?class=".*?editable.*?".*?>[\s\S.]*?<.div>/g ), function( index, value ){
    value.replace(/(id=".*?".*?>)([.\s\S]*?)(<.div>)/ ,"$1" + organizedDivs[index][2] + "$3"); 
});
}

Answer 1

==== UPDATED answer:

OK, I admit that this is a ugly solution, since what I know for ‘halting’ the javascript program is: alert(), confirm(), and sometimes $.ajax({async:false}). :

so my solution is simply re-implement the code by adding the “saveAll()” to the end of each callback function:

$("#dialog").dialog({ autoOpen: false, modal: true, title: 'Save Changes',
buttons: {
    "Don't Save": function() {
        setDivText();
        $( this ).dialog( "close" );
        saveAll();       // newly added line of code       
    },
   "Cancle": function(){
        //....
        $( this ).dialog( "close" );
        saveAll();       // newly added line of code       
    },
   "Save": function(){
        //....
        $( this ).dialog( "close" );
        saveAll();       // newly added line of code       
    }
 // other code...
}

// and in your "finishing function"
function output(){
  if(tinyMCE.activeEditor.isDirty()){
    $("#dialog").dialog('open'); 
    // this line of code : saveAll() was removed from here. 
  }else{
    saveAll();
  }
}