重力形式 Ajax 不工作

Gravity Forms Ajax Not Working

使用Gravity Forms 1.8.1,没有激活其他插件。 还测试了最新版本 1.9.2 使用 Divi 主题以及 2015 主题进行测试,结果相同。 在 Chrome 和 Firefox 中测试,结果相同。

添加了以下简码:

[gravityform id="1" name="test-form-1" ajax="true"]

表单已提交,但始终没有ajax并刷新页面。我可以通过查看选项卡并查看 Chrome 开发人员工具中的 'Net' 选项卡和 Firefox 中的 Firebug 选项卡来判断这一点。 XHR 请求为空,并且请求清晰且 post 通常与非 ajax 请求一样。

这应该有效。查看 Firebug 的控制台选项卡时,我没有收到任何错误或冲突。我发现没有人遇到类似的问题,虽然我不确定有多少重力形式的用户在关注 firebug 中的行为。

我确定我遗漏了一些明显的东西。让我知道它是什么!


Gravity Forms生成的相关表格代码

<div id="gform_wrapper_1" class="gf_browser_gecko gform_wrapper">
   <a class="gform_anchor" name="gf_1" id="gf_1"></a>
   <form action="/sandbox/#gf_1" id="gform_1" target="gform_ajax_frame_1" enctype="multipart/form-data" method="post">
      <div class="gform_heading">
         <h3 class="gform_title">test-form-1</h3>
         <span class="gform_description"></span>
      </div>
      <div class="gform_body">
         <ul class="gform_fields top_label description_below" id="gform_fields_1">
            <li class="gfield               gfield_contains_required" id="field_1_1">
               <label for="input_1_1" class="gfield_label">Name<span class="gfield_required">*</span></label>
               <div class="ginput_container"><input type="text" tabindex="1" class="medium" value="Joe Smith" id="input_1_1" name="input_1"></div>
            </li>
         </ul>
      </div>
      <div class="gform_footer top_label"> <input type="submit" onclick="if(window[&quot;gf_submitting_1&quot;]){return false;}  if( !jQuery(&quot;#gform_1&quot;)[0].checkValidity || jQuery(&quot;#gform_1&quot;)[0].checkValidity()){window[&quot;gf_submitting_1&quot;]=true;} " tabindex="2" value="Submit" class="button gform_button" id="gform_submit_button_1"><input type="hidden" value="form_id=1&amp;title=1&amp;description=1&amp;tabindex=1" name="gform_ajax">
         <input type="hidden" value="1" name="is_submit_1" class="gform_hidden">
         <input type="hidden" value="1" name="gform_submit" class="gform_hidden">
         <input type="hidden" value="" name="gform_unique_id" class="gform_hidden">
         <input type="hidden" value="WyJhOjA6e30iLCJkZjhiZTNiZTg3NDNmMWNlNDNmNTk1N2M0NTY2ZTRiMSJd" name="state_1" class="gform_hidden">
         <input type="hidden" value="0" id="gform_target_page_number_1" name="gform_target_page_number_1" class="gform_hidden">
         <input type="hidden" value="1" id="gform_source_page_number_1" name="gform_source_page_number_1" class="gform_hidden">
         <input type="hidden" value="" name="gform_field_values">
      </div>
   </form>
</div>

确保 jQuery 排在头部 - 而不是页脚。

我使用的是 Roots/Sage 框架,默认情况下它在页脚中排队 - 这导致了您的确切问题。

出于性能原因,您仍应将脚本保留在页脚中。但是您需要将其包含在 <?php wp_head(); ?>:

正上方的 header.php
<?php gravity_form_enqueue_scripts(1,true) ?>

其中 1 是表单的 ID。

除了 Nate Beers 的回答,如果您的表单上有 reCAPTCHA,AJAX 将不起作用。 reCAPTCHA 与 AJAX.

不兼容

在重力形式论坛上查看问题。 https://www.gravityhelp.com/forums/topic/ajax-submission-not-working-on-hard-coded-form#post-36914

我继续使用 Gravity Forms 反垃圾邮件蜜罐作为表单设置页面上的 reCAPTCHA 替代方案。