CODEWITHSUNDEEP
jqueryjquery-ui
anijam
anijam

Reputation: 351

Wait for jQueryUI Popup for continue

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"); 
});
}

Upvotes: 0

Views: 735

Answers (2)

xdazz
xdazz

Reputation: 160893

Just put your what your want to do (like saveAll();) in the callback function.

Like:

"Save": function(){
            organizedDivs[prevSel][2] = tinyMCE.activeEditor.getContent();
            setDivText();
            saveAll();
            $(this).dialog('close');
        }

Upvotes: 0

Siwei
Siwei

Reputation: 21557

==== 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();
  }
}

Upvotes: 2

Related Questions