How do I put a dialog div in form tag

Question

I have a page where I've tried to put a JQuery dialog where data is entered and later goes to a server. The problem I've encountered is that the dialog is outside the form tag, since that whole data I enter is lost somewhere. It looks like this:

I've tried this so far:

var dialogAddPartDiv = $('.dialogAddPart'); 
$('form').append(dialogAddPartDiv);

But it only appends dialogAddPart, not its parents.

The command $('form').append('.ui-dialog') doesn't work in this case. How can I add the parent div of .dialogAddPart in form? The technology I use is XPages, since that I cannot use a inner button inside dialog declaration to proccess AJAX request, all that stuff is defined inside the XPage itself.

Answer 1

jQuery UI Dialog has an appendTo option which allows you to append the dialog to some element:

$( ".selector" ).dialog({
  appendTo: "#someElem"
});