I have a form in a web page dynamically generated and I would like to display it using a the jQuery UI modal dialog.

How can I display the modal dialog form with the remote existing form (myform.html) as content when I click on a link "Open Form"? Clicking on submit button should close the dialog form.

I have a form in a web page dynamically generated and I would like to display it using a the jQuery UI modal dialog.

How can I display the modal dialog form with the remote existing form (myform.html) as content when I click on a link "Open Form"? Clicking on submit button should close the dialog form.

• javascript
• jquery
• forms
• jquery-ui
• web-applications

Share Improve this question Follow edited Jul 29, 2010 at 3:39 djondal asked Jul 26, 2010 at 20:08 djondaldjondal 2,54133 gold badges2424 silver badges4040 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

This will load the content of myform.html into the element with ID formContainer, make the formContainer a modal dialog (showing the form). When submitting the form, the dialog will be closed

$("#formContainer").load("myform.html", function() {
    var container = $(this);
    container.dialog({
        modal: true
    })
    .find("form").submit(function() {
        container.dialog("close");
        return false;
    });
});