首頁  >  文章  >  後端開發  >  yii2 modal彈跳窗之ActiveForm ajax表單異步驗證

yii2 modal彈跳窗之ActiveForm ajax表單異步驗證

WBOY
WBOY原創
2016-07-28 08:29:531146瀏覽

作者:白狼來源:http://www.manks.top/yii2_modal_activeform_ajax.html 本文版權歸作者,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁明顯位置給出原文連接,否則保留追究法律責任的權利。

前面我們講述了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非同步無刷新表單驗證了!

本期主題篇幅短小但內容精湛,希望對你有幫助!

[考慮目前國內網站大部分採集文章十分頻繁,更有甚者不註明原文出處,原作者更希望看客們查看原文,以防有任何問題不能更新所有文章,避免誤導! ]

看原文

以上就介紹了 yii2 modal彈窗之ActiveForm ajax表單異步驗證,包括了方面的內容,希望對PHP教程有興趣的朋友有所幫助。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn