yii2 modal弹窗之ActiveForm ajax表单异步验证
前面我们讲述了yii2中如何使用modal以及yii2 gridview列表内更新操作如何使用modal的问题，本以为modal要告一段落可以开始新的话题了，但是实际问题往往超乎想像，这不modal弹窗提交的表单说是怎么验证的问题又出来了，又出来了！
该问题的实质其实与modal的关系倒不大，其问题的核心在于ActiveForm的异步验证上，解决了首要矛盾，我们本篇文章的问题也就迎刃而解了。顺便再叨唠一句，modal确实没啥好说了。后面若是有我再把话改回来。
yii2中，ActiveForm默认做了客户端验证，但是表单的提交，却不是无刷新的。也就是常常看到的表单提交后页面会刷新。如果想要开启无刷新的模式，只需要在ActiveForm开始开启enableAjaxValidation即可，像下面这样
<?php $form = ActiveForm::begin([
'id' => 'form-id',
'enableAjaxValidation' => true,
'validationUrl' => Url::toRoute(['validate-form']),
]
); ?>注意哦，id和enableAjaxValidation一个都不能少。
关于validateUrl我们做一个说明。如果你不设置该参数，该地址默认是你当前路由，而又恰巧你当前路由就是表单form的action，你会很好奇的发现，当表单项input失去焦点的时候，你对数据的修改已经提交到后端进行了处理了？这往往不是我们想要的，此时就需要给validateUrl设置一个路由地址，其所要请求的操作的意义就在于异步做验证！我们看具体实现：
//表单提交操作，基本上不需要做改动
if ($model->load(Yii::$app->request->post()) && $model->save()) {
return $this->redirect(['index']);
}
}
return $this->render('create', [
'model' => $model,
]);
// @see http://www.manks.top/yii2_modal_activeform_ajax.html
// 看主要的验证操作，该操作是表单字段失去焦点时异步验证，同时如果直接提交表单，也会先执行该操作进行验证
public function actionValidateForm () {
Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
$model = new Model();
$model->load(Yii::$app->request->post());
return \yii\widgets\ActiveForm::validate($model);
}如此一来就简单的实现了yii2异步无刷新表单验证了！
本期主题篇幅短小但内容精湛，希望对你有所帮助！
[考虑目前国内网站大部分采集文章十分频繁，更有甚者不注明原文出处，原作者更希望看客们查看原文，以防有任何问题不能更新所有文章，避免误导！]
(adsbygoogle = window.adsbygoogle || []).push({});
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2018/03/09 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
