.dialog() takes fields out of form

.dialog() takes fields out of form

Hi,

I created an application will provides a popup dialog to add additional information in a POST based form. What I noticed is that when .dialog() is called, the jquery UI creates a new div, appends it to the body element and puts in the div on which the .dialog was called in.

so it becomes something like this

<body>
<form>
<div id="popup">Fields here</div>
</form>
</body>

After $("#popup").dialog()

<body>
<form>
</form>
<div class="ui ...">
<div id="popup">Fields here</div>
</div>
</body>

now, if one submits this form, the fields do not get posted as the jQuery UI has taken them out of the form. 

I have added code on form onsubmit event to correct this, but was thinking if there was something better that could be done.

Regards,
Mrugendra.