为了账号安全,请及时绑定邮箱和手机立即绑定

Yii2 - ActiveForm 和 afterValidate 事件

Yii2 - ActiveForm 和 afterValidate 事件

PHP
MMMHUHU 2023-07-15 16:48:16
我正在将 ActiveForm 与该afterValidate()事件一起使用,但目前afterValidate()会在任何验证事件上触发。我如何区分事件validateOnSubmit和validateOnBlur?validateOnChange基本上,我只希望我的afterValidate()函数在提交时触发。这是我的代码:PHP:<?php $form = ActiveForm::begin([    'id' => 'register-form',    'options' => [        'class' => 'validate-form',    ],    'enableClientValidation' => true,    'enableAjaxValidation' => false,    'validateOnSubmit' => true,    'validateOnBlur' => true,    'validateOnChange' => true,]); ?>JS:// JS afterValidate function$('.validate-form').on('afterValidate', function (event, messages, errorAttributes) {    $('.error-popup').show();    return false;});HTML:<div class="error-popup">Please review the errors in the form below.</div>正如您在上面的函数中看到的afterValidate(),如果存在验证错误,则会显示错误弹出窗口。但是,我只希望在用户提交表单时出现任何验证错误时出现此错误弹出窗口。如果模糊/更改时出现验证错误,则应进行正常的内联验证,而不会弹出任何错误。根据我的理解,beforeSubmit只有在验证通过时才会触发事件。
查看完整描述

3 回答

?
MM们

TA贡献1886条经验 获得超2个赞

Yii 的活动表单 JS 将一些信息保存到yiiActiveForm数据属性中。您可以使用某些submitting属性来确定表单在提交之前是否处于验证状态。


$('.validate-form').on('afterValidate', function (event, messages, errorAttributes) {

    let data = $('.validate-form').data('yiiActiveForm');

    //check if we are in submission process and if there are any errors

    if (data.submitting && errorAttributes.length > 0) {

        $('.error-popup').show();

    }

});


查看完整回答
反对 回复 2023-07-15
?
FFIVE

TA贡献1797条经验 获得超6个赞

您应该在 afterValidate 之后找到 has-error 类并显示弹出窗口尝试以下代码


$('.validate-form').on('afterValidate', function (event, messages, errorAttributes) {

        if ($('.validate-form').find('.has-error').length) {

            $('.error-popup').show();

        }

  });


查看完整回答
反对 回复 2023-07-15
?
人到中年有点甜

TA贡献1895条经验 获得超7个赞

您可以通过以下方式解决此问题:


$("#register-form").on("beforeSubmit", function(event){

    $(this).yiiActiveForm('validateAttribute', 'contactform-phone');

    $(this).yiiActiveForm('validateAttribute', 'contactform-email');

    if ($(this).find('.has-error').length) {

        ...

    }

    ...

    return false;

});

提交按钮会触发beforeSubmit事件,该事件又会触发您需要的任何字段的验证。如果验证结果错误,您可以执行与显示错误消息相关的 JS 逻辑。


查看完整回答
反对 回复 2023-07-15
  • 3 回答
  • 0 关注
  • 142 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信