jQuery Validation 點兩下才送出？別在 submit 事件裡初始化 validate，改用表單綁定一次即可

現象：表單驗證通過時，第一下點擊提交按鈕無反應，第二下才彈出「Win」並送出；驗證不通過時，一下就顯示錯誤訊息。

錯誤代碼

$('#AddColumnsForm').submit(function () {
    $("#AddColumnsForm").validate({   // 每次 submit 都重新初始化！
        submitHandler: function(form) {
            alert("Win");
            $(form).ajaxSubmit();
        }
    });
    return false;
});

根因

`.validate()` 應**只呼叫一次** (通常在 `document.ready`)，它會內部綁定 `submit` 事件。放在 `submit` handler 裡，導致：

1. 第一次點擊：觸發外層 `submit` → 初始化 `validate` → 綁定內部 `submit` → `return false` 阻止預設 → **表單未送出**。
2. 第二次點擊：外層 `submit` 再跑一次 → `validate` 已初始化 → 內部 `submitHandler` 生效 → **送出成功**。

正確寫法

$(function () {
    // 1. 頁面載入時初始化一次
    $("#AddColumnsForm").validate({
        rules: { /* 驗證規則 */ },
        submitHandler: function(form) {
            alert("Win");
            $(form).ajaxSubmit(); // 需引入 jquery.form.js
            return false; // 防止雙重提交
        }
    });
    // 2. 不需要再手寫 .submit()
});

補充：若需動態新增欄位再驗證

// 新增 input 後
$newInput.rules('add', { required: true, number: true });

記住：**`validate()` 是「配置」，不是「觸發」。配置一次，終身受益。**