jQuery modal dialog with postbacks in ASP.NET

Question

I just upgraded my jQuery/jQuery UI to the latest version (jQuery 1.9.0, jQuery UI 1.10.0), and it seems to have broken some of my jQuery UI dialog functionality. In order to do postbacks in a jQuery UI dialog in ASP.NET, there was a pretty common workaround where you would have to re-append your DIV to the main FORM, since jQuery would re-construct the DIV outside the FORM, like so: ``` $("#newInsurance").dialog({ autoOpen: false, modal: true, open: function (type, data) { $(this).parent().appendTo($("form:first")); } }); ``` Unfortunately, since upgrading this now puts the Dialog behind the gray/disabled overlay for the background. So the form in the Popup is unusable and all grayed out. I've tried several things and I can't seem to get it to work - it seems as if this old work-around no longer works. Does anyone know of a new work-around that will work? Or am I missing something? This worked great up until I upgraded. Here is some more information about the work-around that USED to…

Accepted Answer

OK, so this seems to be the fix for jQuery UI v1.10:

```
$("#newInsurance").dialog({
    autoOpen: false,
    appendTo: "form",
    modal: true
}).parent().css('z-index', '1005');
```

In jQuery UI v1.10 they added an appendTo property, which seems to do the same exact thing as calling `.parent().appendTo($("form"))`. The trick to the fix is the z-index.

jQuery modal dialog with postbacks in ASP.NET

Solution

Problem

Related problems