jquery - 在花式框中提交联系表格

Question

我在 FancyBox 2 模式窗口中打开了一个联系表单。但是当您提交表单时，当前页面会刷新并且联系表单会消失。

您可以通过单击主菜单中的支持来检查我的站点中的此错误

这是我的代码，

$(document).ready(function() {
    $(".various").fancybox({
        maxWidth    : 800,
        maxHeight   : 600,
        fitToView   : false,
        width       : '70%',
        height      : '70%',
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none'
    });
});

这是我的联系表格链接，

<a href="formhome.php" class="menu-support fancybox.ajax">Support</a>

谁能告诉我如何在不重新加载页面的情况下在花哨的框中提交我的联系表格？

Answer 1

你需要的是jquery ajax

jQuery

$('#idOfcontactForm').submit(function(){
   $.ajax({
     url:"yourpage.php", // action of the form ,
     data:$(#contactform).serialize(), // send forms data to server
     dataType:"json", // take response as json
     type:"post", //send form by post or get
     success:function(result){
       alert(result.msg);
    }
   });
    return false;  // default submit return false
 });

PHP(你的页面.php)

  //manupulate you submited data..
  // if using post you can get data by $_POST;
  echo json_encode(array('msg'=>"successfully saved");