2

有谁知道我如何在 Gravity 表单中启用 JS 验证?

我已将我的 3 个字段中的每一个都标记为“必填”,但是当我提交一个空表单时,仍然需要不必要地访问服务器,因为客户端似乎没有执行 JavaScript 验证。

这是我尝试过的简码:

    [gravityform id="1" title="false" description="true" ajax="true"]
[gravityform id="1" title="false" description="true" ajax="false"]

我已经四处搜索,但在任何地方都找不到任何信息。任何帮助将非常感激。

4

6 回答 6

1

除非您实现一个在发布到服务器之前验证的客户端库,否则您永远不会得到您正在寻找的结果。那里有几个图书馆。

https://github.com/DiegoLopesLima/Validate

根据文档,您可以使用必需的标签标记表单字段输入。它还支持其他几种验证类型。然后,在您发布之前,验证您的整个表单:

jQuery('form').validate();

它似乎是一个相当全面的库。祝你好运。

于 2013-03-09T14:40:07.407 回答
1

AFAIK,您无法启用它,您必须从编辑页面将类应用于表单字段并编写自己的 JS 进行验证或使用validation库。

注意:我用了 GF 快 6 个月了,我不知道他们的新版本是否支持前端验证

于 2013-03-09T14:32:55.880 回答
1

我编写了一个插件,您可以使用它来启用重力表单的 jQuery 验证。你可以在这里查看演示。https://demos.dnesscarkey.com/jquery-validation-for-gravity-forms/

谢谢

于 2020-11-26T13:11:08.033 回答
0

当您说没有任何验证时,您的意思是您将必填字段保持打开状态并且它只是重新加载页面而不显示验证错误?

使用新的 Woocommerce 2.0.X,验证消息在 Gravity Forms 中被破坏。我有 Woocommerce 1.XX 和 Gravity Forms,它们运行良好。由于升级 Woocommerce 验证消息不再显示。表单没有提交,它只是重新加载页面,没有任何迹象表明发生了什么。我在 Gravity Forms 论坛上发布了一个帖子,他们确定它是 Woocommerce,我在一个旧网站上做了一些测试,该网站有两个插件的旧版本,我同意,它是 Woocommerce,而不是 Gravity Forms。耶,Woocommerce!

于 2013-03-22T18:29:08.230 回答
0

如前所述,似乎 Gravity Forms 不处理开箱即用的前端验证

遇到了同样的问题,我使用jquerv 验证插件和以下代码片段解决了它


在您的 functions.php 文件中

add_action('gform_pre_enqueue_scripts',function(){
    wp_enqueue_script('jquery-validate','https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js', ['jquery'], );
});

然后在您的自定义 javascript 文件中(如果您还没有,则必须创建一个并将其排入队列)

(function($) {

  /**
   * Checks if the jquery-validate library is loaded
   */
  if ( !$.validator instanceof Function) {
    return;
  }

  $('form[id*=gform_]').each(function() {
    var validationOptions = {
      rules: {},
    };
    $(this).find('.gfield_contains_required input').each(function(i) {

      var ruleName = $(this).attr('name');

      if (validationOptions.rules.hasOwnProperty(ruleName)) {
        return;
      }

      validationOptions.rules[ruleName] = {
        required: true,
      };
    });
    if (Object.keys(validationOptions.rules).length > 0) {
      $(this).validate(validationOptions);
    }
  });
})(jQuery)

这将搜索每个重力表单元素,并为表单创建者上已标记为必填的字段设置必填规则

于 2018-06-12T12:05:39.007 回答
-1

此链接可能对您有所帮助: 在此处输入链接描述

或者您可以在将此代码放入您的 function.php 后尝试此操作

<?php function comment_validation_init() {
if(is_page(14))
{
    ?>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
    $('#gform_1').validate({

    rules: {
      input_1: {
        required: true,
      },input_6: {
        required: true,
        email: true
      },

      input_3: {
        required: true,
      }
    },


    errorElement: "div",
    errorPlacement: function(error, element) {
      element.before(error);
    }

    });
    });
    </script>
    <?php
}}add_action('wp_footer', 'comment_validation_init');?>
于 2015-01-29T06:16:05.117 回答