Question

Is there a way to create a form in pop-up window on click of a button using jquery? Form will have few input fields and ‘Save’ & ‘Cancel’ buttons. So on clicking ‘Save’, the information in form will be saved in database and will be back to original screen. I would like to have a fade-in pop up window.

Answer 1

Use this code

HTML

<div id="divdeps" style="display:none" title=""></div>

Jquery on DOM ready

$("#divdeps").dialog({
    autoOpen: false,
    show: 'slide',
    resizable: false,
    position: 'center',
    stack: true,
    height: 'auto',
    width: 'auto',
    modal: true
});

This code will initialize a Dialog and put it in state ready to be open and successively closed.
If you want to open the dialog when the page loads then add this line of code just after the code you’ve already added in document ready:

$("#divdeps").dialog('open');

If instead you want to open the Dialog following a click event add the same code on the click event of the element that should fire the opening.

Add your form inside the myDialog DIV. If you need more help regarding the form submission just give us more details…