how to open jQuery UI dialog with AJAX request?
30,989
Solution 1
You can define your dialog like this :
function showUrlInDialog(url){
$.ajax({
url: 'dialog.html',
success: function(data) {
$("#dialog-form").load(data).dialog({modal:true}).dialog('open');
}
});
}
And define the current markup that is inside dialog-form div, into a new page called dialog.html. Call the above written function on the button click event. I hope this is what you needed.
Solution 2
I think this is a simpler version of the answer:
$("#the-button").click(function(){
$("#dialog").dialog({modal: true}).dialog('open')).load("dialog.html")
})
Author by
Admin
Updated on December 26, 2020Comments
-
Admin over 3 years
On my web page I have a jQuery UI Dialog. When I click the button (create new user) it opens a new window. My question is how can I open that window with an AJAX request?
It would be nice to open the dialog-form from another page. For example:
dialog.html
<div id="dialog-form" title="Create new user"> <p class="validateTips">All form fields are required.</p> <form> <fieldset> <label for="name">Name</label> <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" /> <label for="email">Email</label> <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" /> <label for="password">Password</label> <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" /> </fieldset> </form> </div>
You can see full code in this fiddle:
-
Admin over 10 yearsIt worked, thank you. One question: Ajax loads that window while clicking? Or loads before? If I will write sql query into dialog, will my php page read the sql query when I enter the site or will read after when I click button?
-
Abhishek Punj over 10 yearsIt is supposed to load before as far as I think. The page will be requested as soon as the code I mentioned above runs. You can cross check that by taking a look at the fiddler trace. Hence the SQL query is also supposed to run when the page loads and not when the button is clicked.
-
Admin over 10 yearsOkay, man, I should write a couple of sql query into dialog. And I want php sends sql reguests when I start clicking the button. After clicking is writed: Please wait, loading ... after a few seconds is opened dialog. You can see it on Facebook, when user wants to see like list..after a few seconds is opened dialog and show all likes.
-
Abhishek Punj over 10 yearsThis is what will help you.. 8raystech.com/2011/06/28/…
-
KarSho over 8 yearsFor me
$("#dialog-form").html(data).dialog({modal: true}).dialog('open');
-
Gustavo Rossi Muller about 7 yearsjust use .load(your_url); sample: $("#dialog-form").load("dialog.html").dialog({modal:true}).dialog('open');