場景

註冊表單需即時檢查用戶名/郵箱是否已被佔用，Yii 2.0 內建 yii\bootstrap\ActiveForm 支援 AJAX 驗證，配合模型規則極簡實現。

一、視圖：啟用 AJAX 驗證

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
/* @var $model frontend\models\SignupForm */

$this->title = '註冊';
$this->params['breadcrumbs'][] = $this->title;
?>

    
title) ?>
     'form-signup',
        'enableAjaxValidation' => true,   // 關鍵：開啟 AJAX
        'enableClientValidation' => true, // 同時啟用客戶端
    ]); ?>
    field($model, 'username') ?>
    field($model, 'email') ?>
    field($model, 'password')->passwordInput() ?>
    field($model, 'password_compare')->passwordInput() ?>
    

         'btn btn-primary', 'name' => 'signup-button']) ?>
    
    

二、控制器：處理 AJAX 請求

public function actionSignup() {
    $model = new SignupForm();
    if (Yii::$app->request->isAjax) {
        Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
        return ActiveForm::validate($model); // 直接返回驗證結果 JSON
    }
    if ($model->load(Yii::$app->request->post())) {
        if ($user = $model->signup()) {
            if (Yii::$app->getUser()->login($user)) {
                return $this->goHome();
            }
        }
    }
    return $this->render('signup', ['model' => $model]);
}

三、模型：驗證規則與註冊邏輯

namespace frontend\models;
use common\models\User;
use yii\base\Model;
use Yii;

class SignupForm extends Model {
    public $username;
    public $email;
    public $password;
    public $password_compare;

    public function rules() {
        return [
            ['username', 'filter', 'filter' => 'trim'],
            ['username', 'required'],
            ['username', 'unique', 'targetClass' => User::class, 'message' => '用戶名已存在。'],
            ['username', 'string', 'min' => 2, 'max' => 255],

            ['email', 'filter', 'filter' => 'trim'],
            ['email', 'required'],
            ['email', 'email'],
            ['email', 'unique', 'targetClass' => User::class, 'message' => '郵箱已存在。'],

            [['password', 'password_compare'], 'required'],
            [['password', 'password_compare'], 'string', 'min' => 6, 'max' => 16],
            ['password_compare', 'compare', 'compareAttribute' => 'password', 'message' => '兩次密碼不一致'],
        ];
    }

    public function signup() {
        if (!$this->validate()) return null;
        $user = new User();
        $user->username = $this->username;
        $user->email = $this->email;
        $user->setPassword($this->password);
        $user->generateAuthKey();
        return $user->save() ? $user : null;
    }
}

四、User 模型關鍵方法（common/models/User.php）

public function setPassword($password) {
    $this->password_hash = Yii::$app->getSecurity()->generatePasswordHash($password);
}
public function generateAuthKey() {
    $this->auth_key = Yii::$app->getSecurity()->generateRandomString();
}
public function validatePassword($password) {
    return Yii::$app->getSecurity()->validatePassword($password, $this->password_hash);
}

五、前端效果

• 輸入框失焦 → 發送 AJAX POST /site/signup（含字段值）
• 後端返回 JSON：{"username":["用戶名已存在。"]} 或 []
• ActiveForm 自動在字段下方顯示/隱藏錯誤提示

六、進階：獨立驗證 Action（可選）

若不想混在 actionSignup，可建立 actionValidate：

public function actionValidate() {
    if (Yii::$app->request->isAjax) {
        Yii::$app->response->format = Response::FORMAT_JSON;
        $model = new SignupForm();
        $model->load(Yii::$app->request->post());
        return ActiveForm::validate($model);
    }
}

視圖改為：'validationUrl' => ['site/validate']（ActiveForm 選項）。

總結

Yii 2.0 實現「用戶名/郵箱唯一性 AJAX 驗證」只需三步：視圖開啟 enableAjaxValidation、控制器返回 ActiveForm::validate()、模型加 unique 規則。零 JS 手寫，體驗流暢。