Demo of Dialog box to submit data to parent page using JQuery

First Name
Second Name



HTML

<button id="b1">Open Dialog Box</button><div id=msg></div>
<div id="my_dialog" title="plus2net  dialog"><form id=f1>
  <p>First Name<input type=text id=t1 name=t1><br>
       Second Name<input type=text id=t2 name=t2></form></p>
</div>

JQuery


<script>
   $(document).ready(function() {
var pos = { my: "center center", at: "center top+150", of: window };
/////////
$(function() {
    $( "#my_dialog" ).dialog({
autoOpen: false,
position:pos,
 buttons: {
     "Close ": function() {
      $( this ).dialog( "close" );
      },
     "Submit ": function(){
     $('#msg').html($("#f1").serialize());
     $( this ).dialog( "close" );
     }
   }
		});
});
/////////
$("#b1").click(function(){
$( "#my_dialog" ).dialog( "open" );
})

})
</script>



Dialog Box Demo Display on load Display after time delay Open on Button Click Add one Close Button With Input box & Submit Button With Hide & show animation effects Passing data to Dialog box Displaying database record in Dialog box ( by entering ID) Displaying database record in Dialog box ( By button click) Displaying Form for user input and inserting data to table Edit / update a record by usign a form in Dialog box