2017年8月28日 星期一

[.Net MVC] Remote validation example (Input Date isn't greater than today)

說明:
Remote驗證是一種假前端驗證,背後是用ajax呼叫後端Action,
方便開發人員在後端編寫驗證邏輯,不過預設只能在前端觸發。

範例:
首先新增一Controller做驗證,注意Action傳入參數名稱要與ViewModel對應的屬性名稱相同(Model binding)。


在ViewModel該屬性上掛上RemoteAttribute class。
第一個參數是Action name,第二個參數是Controller name。


View部分,使用HtmlHelper產生html element,
需再include jquery、jquery-validate與jquery.validate.unobtrusive.js。

執行網頁後,檢視HTML發現多了remote相關屬性:

切到Network tab,當觸發該欄位時,會送出get request,後端傳回true或false。

實際畫面如下。

結論:
● Remote驗證還是前端驗證,因此不保險,重要驗證還是須通過後端驗證。
● 若觸發欄位無變動,不會送出request,多欄位比較驗證要注意(例:兩個日期比較)。


參考資料:
https://msdn.microsoft.com/en-us/library/system.web.mvc.remoteattribute(v=vs.118).aspx