Fijate en este caso que estoy usando yo en un proyecto que estoy haciendo:
Código HTML:
function confirmar_conceptos(){ //evento del botom
$('#dialog').dialog('open'); //dialog es el id del div donde esta el formulario en tu caso
return false;
}
$(function(){
$('#dialog').dialog({
autoOpen: false, //ciertas configuraciones que se le dan a la ventanita
width:600,
closeOnEscape: false,
resizable: false,
modal: true,
beforeOpen: function(){
$(this).dialog("open"); //funcion que abre la ventanita
},
buttons: {
"Si":
function (){ //evento que se ejecuta cuando se da en el botom "SI" de la ventanita
var form1 = $('#form1'); //var contiene todos los datos que estan en form1 (el formulario que estaria dentro de la ventanita)
var vars = form1.serialize(); // se convierten los datos a algo entendible por PHP
$("#final").fadeOut("slow");
$.ajax({ // aca se envian con AJAX los datos al archivo donde insertas las cosas en la BD
type: "POST",
contentType:"application/x-www-form-urlencoded",
url:"TU_ARCHIVO_PARA_INSERTAR_EN_LA_BD.php",
data:vars,// los datos del formulario que estan en vars
success:function(msg){
//Respuesta del servidor, por ejemplo, en el archivo TU_ARCHIVO_PARA_INSERTAR_EN_LA_BD.php pones un echo "Todo se inserto correctamente";
$("#final").fadeIn("slow",function(){
$("#final").html(msg); //final es un div con id="final" (que agregas a tu pagina) donde se escribira la respuesta del servidor
})
}})
$(this).dialog("close"); //se cierra la ventanita al recbir la respuesta
},
"No": function() {
$(this).dialog("close");
}
}
});
}
);