通过回调提交带有ajax的表单答案

【问题标题】：Submit form with ajax via callback通过回调提交带有ajax的表单
【发布时间】：2016-09-15 09:29:13
【问题描述】：

我想在点击 gcapcha 时提交表单。我尝试使用我知道的（我愚蠢的）jquery 函数提交。但这行不通。

这是我的代码（有什么问题）。 Javascript

var verifyCallback = function(e) {
document.getElementById("form-contact").submit();
 $.ajax({
    type : 'POST',
    url  : 'inc/contact_sent.php',
    data : $(this).serialize(),
        success :  function(data){
            $("#contact").html(data);
        }
    });
return false;
};
var onloadCallback = function() {
    grecaptcha.render("captcha", {
        sitekey: "xxx",
        callback: verifyCallback
    })
};

HTML

<div id="contact" class="contact-form">
    <form class="ajaxForm detailedsearch inline-style" method="post" id="form-contact">
        <input type="text" class="form-control" name="cntc_name" placeholder="Your name" required>    
        <input type="email" class="form-control" name="cntc_email" placeholder="Your email" required>
        <input type="text" class="form-control" name="cntc_tel" placeholder="Your phone">    
        <input type="text" class="form-control" name="cntc_subj" placeholder="Subject" value="<?=(isset($_POST['ptitle']))?"Queries for $_POST[ptitle]":""?>"  required>    
        <textarea class="form-control" name="cntc_desc" rows="6" placeholder="Your Detail" required></textarea>
        <div class="form-group">                    
            <div id="captcha" class="center-captcha"></div>
            <div id="gcaptcha" style="transform:scale(0.50);-webkit-transform:scale(0.50);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>
            <span class="text-danger">*Please complete the form to proceed.</span>
        </div>
        <!-- <button type="submit" class="btn btn-success btn-block"><i class="fa fa-envelope-o"></i>&nbsp;Submit Form</button> -->
    </form>
</div>

【问题讨论】：

您能提供您的<form> 代码吗？
有回调：verifyCallback 将始终返回 FALSE bcoz return false;在函数中为什么？
@PraneshRavi，请查看更新。谢谢。
@Gopalakrishnan - 因为表单不通过 ajax 发送任何元素。

标签： javascript php jquery ajax forms

【解决方案1】：

你应该这样做......

//register a event for form submit
$( "form" ).submit(function( e ) {
  e.preventDefault();
  $.ajax({
    type : 'POST',
    url  : 'inc/contact_sent.php',
    data : $(this).serialize(), //serialize the form data
    success :  function(data){
       $("#contact").html(data);
    }
  });
});

var verifyCallback = function(e) {

 //submit form
 $("#form-contact").submit();

 return false;
};

var onloadCallback = function() {
  grecaptcha.render("captcha", {
      sitekey: "xxx",
      callback: verifyCallback
  })
};

【讨论】：

感谢您的回复。但不是在ajax中做。它提交表单并刷新整个页面，而不发送来自“#form-contact”的值。是否有任何代码可以使表单在“$.ajax”中提交？
@Wilf 更新了答案。从表单中删除 method 属性。