Question

使用beforeSubmit的{{1}}函数，如何在验证通过时让它执行正常的表单提交？

我尝试了以下内容：

yii.activeForm.js

控制器：

$('.ajax-form').on('beforeSubmit', function (event) {
    var form = $(this);
    var url = form.attr('action');
    var type = form.attr('method');
    var data = form.serialize();

    $.ajax({
        url: url,
        type: type,
        data: data,
        success: function (result) {
            if (result.errors.length != 0) {
                form.yiiActiveForm('updateMessages', result.errors, true);
            }
            else if (result.confirmed == true) {
                $('.confirm-panel').show();
            }
            else {
                return true;
            }
       },
       error: function() {
           alert('Error');
       }
    });

    // prevent default form submission
    return false;
});

正如您所看到的，我也在尝试在我的AJAX响应中返回其他数据。我遇到的问题是ajax成功的public function actionProcess() { $model = $this->findModel($id); if (Yii::$app->request->isAjax) { $return_array = [ 'errors' => [], 'confirmed' => false, ]; Yii::$app->response->format = Response::FORMAT_JSON; $return_array['errors'] = ActiveForm::validate($model); if ($model->confirm == 1) { $return_array['confirmed'] = true; } return $this->asJson($return_array); } if ($model->load(Yii::$app->request->post()) && $model->save()) { return $this->redirect(['success']); } return $this->render('process', [ 'model' => $model, ]); }是不起作用的。我似乎无法摆脱这个功能。我在这里也尝试了return true，但这只是通过AJAX进行提交循环。

顺便说一句，我没有使用form.submit()因为我在控制器中进行了一些额外的自定义验证。所以这就是我为此创建自己的自定义处理程序的原因。

Answer 1

输入验证应该在模型中进行，无论它是内置的还是自定义的。然后，您可以轻松使用默认的ajax验证。

要创建自定义验证程序，请选中http://www.yiiframework.com/doc-2.0/guide-input-validation.html#creating-validators

Answer 2

首先，您不能在ajax return true中success function继续提交表单，因为它是javascript而最后一行return true已经是在收到response之前执行，以便通过在成功函数中返回true来提交表单。

如果要在成功进行ajax验证后手动提交页面而不是使用afterValidate，则需要使用事件beforeSubmit，因为如果您尝试使用提交表单，它将进入无限循环ajax成功函数中的$("form").submit()。所以改变你的行

$('.ajax-form').on('beforeSubmit', function (event) {

到

$('.ajax-form').on('afterValidate', function (event) {

然后将您的成功功能更改为

success: function (result) {
            if (result.errors.length != 0) {
                form.yiiActiveForm('updateMessages', result.errors, true);
            }
            else if (result.confirmed == true) {
                $('.confirm-panel').show();
            }
            else {
                form.submit();
            }
       },

希望它可以帮助你。

Answer 3

您无需为此提议编写任何此类代码。 Yii可以自己处理ajax验证。您需要做的只是以活动形式启用它，如。

php $form = ActiveForm::begin([
         'id' => 'contact-form',
         'enableAjaxValidation' => true,
 ]); ?>

并在初始化$ model后将此代码放在控制器中。

if (Yii::$app->request->isAjax) {
    Yii::$app->response->format = Response::FORMAT_JSON;
    return = ActiveForm::validate($model);
}

Yii2 - 使用普通表单提交activeform ajax验证

3 个答案: