Yii2 ActiveForm元件的ajax提交
阿新 • • 發佈:2018-11-01
ActiveForm如何非同步提交?
1.首先在views層的ActiveForm中配置以下屬性
$form = ActiveForm::begin([ 'action' => Url::to(['post/save']), //此處為請求地址 Url用法檢視手冊 'enableAjaxValidation' => true, 'validationUrl' => Url::to(['post/validate']), //資料非同步校驗 ]);
2.配置好表單屬性之後,在控制器中新增對應的方法
validateUrl對應的方法
//該方法是非同步校驗欄位,輸入框失去焦點之後自動會自動請求改地址 public function actionValidate(){ $model = new PostModel(); if (Yii::$app->request->isAjax && $model->load(Yii::$app->request->post())) { Yii::$app->response->format = Response::FORMAT_JSON; return ActiveForm::validate($model); } }
action對應的方法
//該方法是資料儲存方法 public function actionSave() { $model = new PostCatModel(); if ($model->load(Yii::$app->request->post())) { Yii::$app->response->format = Response::FORMAT_JSON; return ['status' => $model->save()]; } }
除此之外,還要寫一段提交的js
//此處點選按鈕提交資料的jquery $('.btn').click(function () { $.ajax({ url: "/post/save.html", type: "POST", dataType: "json", data: $('form').serialize(), success: function(Data) { if(Data.status) alert('儲存成功'); else alert('儲存失敗') }, error: function() { alert('網路錯誤!'); } }); return false; });
注:actionSave中對應的名稱空間要加上,否則會報錯
比如 Response 和 ActiveForm
use yii\web\Response; use yii\bootstrap\ActiveForm;
上面就是ActiveForm對應的非同步提交方法