Comment placer un div de dialogue dans une balise de formulaire ?

Question

J'ai une page où j'ai essayé de mettre un dialogue JQuery où les données sont saisies et vont ensuite vers un serveur. Le problème que j'ai rencontré est que la boîte de dialogue se trouve à l'extérieur de l'interface de l'utilisateur. form puisque toutes les données que je saisis sont perdues quelque part. Ça ressemble à ça :

J'ai essayé jusqu'à présent :

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

Mais il ajoute seulement dialogAddPart, pas ses parents.

La commande $('form').append('.ui-dialog') ne fonctionne pas dans ce cas. Comment puis-je ajouter le div parent de .dialogAddPart dans le formulaire ? La technologie que j'utilise est XPages, depuis que je ne peux pas utiliser un bouton interne dans la déclaration de dialogue pour traiter la demande AJAX, tout cela est défini dans la XPage elle-même.

Answer 1

La fenêtre de dialogue de jQuery UI dispose d'une appendTo qui vous permet d'ajouter la boîte de dialogue à un élément quelconque :

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

Answer 2

Vous dites que vous avez essayé $('form').append('.ui-dialog') mais cela ne devrait pas suffire.

Explicitement, vous devriez essayer :

var uiDialog= $('.ui-dialog'); 
$('form').append(uiDialog);

Ou, en une seule ligne :

$('form').append($('.ui-dialog'));

Vous devriez envisager d'attribuer des identifiants uniques à certains de ces éléments, car il se peut que vous ayez plus tard plus d'un seul élément de formulaire, par exemple.