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请求是空的,请求会像非ajax请求一样正常清除和发布。

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

我确信我遗漏了一些显而易见的东西。让我知道它是什么!


重力表单生成的相关表单代码

<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>

出于性能原因,您仍然应该将脚本保留在页脚中。但您需要将其包含在<?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替代方案。

确保jQuery在页眉而不是页脚中排队。

我使用的是Roots/Sage框架,默认情况下它会在页脚中排队——这正是导致您出现问题的原因。

最新更新