how to detect what triggered the close event in jquery ui dialog

Question

Hello,

I have Create and Cancel buttons as part of a jquery-ui modal dialog. I want to do certain thing after closing the dialog only if the user clicks "Create". If they click "Cancel", or "X" or press Esc, I want to do something else. Is there a way to pass parameters to the close event handler or some other way to detect what caused the close?

Answer 1

try this as discribed here: http://jqueryui.com/demos/dialog/#modal-confirmation

-- edit

copied from the link from above:

 var trigger = "";
 $("#dialog").dialog({
  bgiframe: true,
  resizable: false,
  height:140,
  modal: true,
  overlay: {
   backgroundColor: '#000',
   opacity: 0.5
  },
  buttons: {
   'Create': function() {
    // do your stuff
    trigger = "create";
    $(this).dialog('close');
   },
   Cancel: function() {
    $(this).dialog('close');
   }
  }
  close: function() {
   if (trigger == "create")
       // do something here
  }
 });

Answer 2

define events for your buttons like this

$("#dialog").dialog({
  bgiframe: true,
  autoOpen: false,
  height: 300,
  modal: true,
  buttons: {
   'Create': function() {
    alert('the user clicked create');
    $(this).dialog('close');
   },
   Cancel: function() {
    alert('the user clicked cancel');
    $(this).dialog('close');
   }
  },
  close: function() {

  }

});

Also take a look at the parameters passed into the close event, the method signature is function(event, ui)

you can find more info here link text

Answer 3

$('#jqPopup').dialog({modal:true,title:tit,autoOpen:false,beforeclose:function(){
   //Will get triggered when user press the 'X' button 
   $("#wholeContent").css('display','block');} 
});

$("#wholeContent").css('display','none');

$('#jqPopup').dialog('open');