Yii2 - activeform ajax 正常表单提交验证
Yii2 - activeform ajax validation with normal form submit
使用yii.activeForm.js
的beforeSubmit
功能,如何让它在验证通过时执行正常的表单提交?
我试过以下方法:
$('.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;
});
控制器:
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 在我的 AJAX 回复中添加其他数据。我遇到的问题是 ajax 成功中的 return true
不起作用。我似乎无法摆脱这个功能。我也在这里尝试过 form.submit()
但这只是通过 AJAX.
进行提交循环
顺便说一下,我没有使用 enableAjaxValidation
,因为我的控制器中有一些额外的自定义验证。所以这就是为什么我为此创建了自己的自定义处理程序。
无论是内置的还是自定义的,都应在模型中进行输入验证。然后就可以轻松使用默认的ajax验证了。
要创建自定义验证器,请检查 http://www.yiiframework.com/doc-2.0/guide-input-validation.html#creating-validators
首先,您不能从 ajax success function
中 return true
继续提交表单,因为它是 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();
}
},
希望对您有所帮助。
您无需为此提议编写任何此类代码。 Yii 可以处理 ajax 验证 it-self。您唯一需要做的就是以活动形式启用它。
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);
}
使用yii.activeForm.js
的beforeSubmit
功能,如何让它在验证通过时执行正常的表单提交?
我试过以下方法:
$('.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;
});
控制器:
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 在我的 AJAX 回复中添加其他数据。我遇到的问题是 ajax 成功中的 return true
不起作用。我似乎无法摆脱这个功能。我也在这里尝试过 form.submit()
但这只是通过 AJAX.
顺便说一下,我没有使用 enableAjaxValidation
,因为我的控制器中有一些额外的自定义验证。所以这就是为什么我为此创建了自己的自定义处理程序。
无论是内置的还是自定义的,都应在模型中进行输入验证。然后就可以轻松使用默认的ajax验证了。
要创建自定义验证器,请检查 http://www.yiiframework.com/doc-2.0/guide-input-validation.html#creating-validators
首先,您不能从 ajax success function
中 return true
继续提交表单,因为它是 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();
}
},
希望对您有所帮助。
您无需为此提议编写任何此类代码。 Yii 可以处理 ajax 验证 it-self。您唯一需要做的就是以活动形式启用它。
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);
}