demoshop

demo, trying to be the best_

版本
3

有許多的時候我們會希望在前端驗證後,表單送出前再加入自己的特殊處理事件,所以會不希望驗證是在使用者按下 Submit 後才執行,此篇舉一個很爛的例子來介紹如何自行呼叫前端驗證(例子真的很爛,我想兩天想不到簡單的例子....)

●依序前文的案例,但是為了測試方便我們將 AccountModels 內的 RegisterModel Class 驗證改為全部必填就好

[Required]
public string UserName { get; set; }

[Required]
public string Email { get; set; }

[Required]
public string Password { get; set; }

●回到 Register.cshtml 將原本的 submit 按鈕註解掉改成一個 Button

<p>
    @*<input type="submit" value="Register" />*@
    <input id="submit" type="button" value="我是 Button" />
</p>

●增加一段 js code

$(function () {
    $("#submit").click(function (e) {
        if (!$('form').valid()) {
            var error = '';
            $(".field-validation-error").each(function (index, domEle) {
                error += $(domEle).text()+'\n';
            });
            alert(error);
        }
        else
        $('form').submit();
    });
});

這段 js Code 利用了第3行自行呼叫了驗證,當驗證失敗發生時利用 alert 顯示錯誤訊息,如果驗證通過,即送出表格


demo廢言

就這樣....這篇是極短篇重點是介紹如何自行呼叫驗證,但真的想不出好例子所以就這樣惡搞了一下還請各位見諒

 

回應討論