Display modal dialog with jquery ui without element?

Question

I am making a small jquery application. I need a confirmation window. However, I do not want to add an element to the body so that I can open the dialog box. Is there any way to avoid this? To just bring up a dialog and pass arguments like title, text and parameters?

Answer 1

When creating the jQuery UI dialog box, the current versions (1.8. *) Automatically add the dialog to the body.

So, if you do:

$('<div>').dialog({modal: true}) 

It just works. You have to make sure that you call .remove() when the dialog is closed to remove the new item though!

 function myalert(title, text) { var div = $('<div>').html(text).dialog({ title: title, modal: true, close: function() { $(this).dialog('destroy').remove(); }, buttons: [{ text: "Ok", click: function() { $(this).dialog("close"); }}] }) }; myalert("Test", "This is a test modal dialog"); 

See http://jsfiddle.net/alnitak/G3GRZ/ for a full working demo.

Answer 2

Just do it:

 $('<div>My dialog text.</div>').dialog({ modal: true });