Can JQuery UI Dialog remember its position between opening and closing

Question

I have a JQuery dialog that I dynamically open and close. Everything is working fine except the position of the dialog is not remembered after it is closed and then reopened.

The size is maintained but the position is not.

I have tried hooking into the 'Open' event but it appears that the position is being reset by JQuery UI after I manually reposition the element.

Is maintaining the size of the dialog possible? I certainly think it should be.

Answer 1

You could use the jQuery UI Dialog "beforeclose" event to store the position and size. You can set both position and size using the "option" method.

Here is what currently works for me:

$(function() {
 $("#dialog").dialog({
  beforeclose: function(){
   $(this).dialog('option', 'position', [$(this).offset().left, $(this).offset().top]);
   $(this).dialog('option', 'width', $(this).width());
   $(this).dialog('option', 'height', $(this).height());
  }
 });
});

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

Answer 2

Take a look at jquery changeset. You'll also find a fix for this

Answer 3

You can override the standard close method by returning false on 'beforeclose' and using jquery to hide the dialog:

$.ui.dialog.defaults.beforeclose = function() {
    $(this).closest('.ui-dialog').hide();
    return false;
};

and this to reopen:

$('#list').closest('.ui-dialog').show();