類似的文章園子里已有，請看這里，個人感覺稍顯復(fù)雜，日前也打算寫一個簡單的給項目用，一些關(guān)鍵點記錄于此。最終效果如下：

后端使用Asp.net mvc5，前端框架有：jquery.validate、jquery.validate.unobtrusive、requirejs、Bootstrap，都是當(dāng)前最/較新版本。jquery.validate就不用說了，目前比較流行的前端校驗組件；jquery.validate.unobtrusive基于jquery.validate，是為了配合Asp.net mvc，微軟自己寫的，NuGet下可查找Microsoft.jQuery.Unobtrusive.Validation安裝，具體怎么用請繼續(xù)往下看。

首先在后臺我們定義實體類：

 實體定義

實體各屬性上面有Attribute形式的校驗規(guī)則，當(dāng)用戶提交一個Model到后端Action時，MVC框架會據(jù)此自動幫我們完成校驗工作，于是后端開發(fā)就很開心。然而在數(shù)據(jù)提交之前，前端也有必要進行第一輪的校驗，如果使用jquery.validate，那么需要在js或標(biāo)簽里再寫一遍類似的規(guī)則，能不能復(fù)用后端已有的代碼呢？我們以屬性EnterpriseNo為例，在cshtml中寫：

@Html.TextBoxFor(m => m.BasicInfo.EnterpriseNo, new { placeholder = "必填項", @class = "form-control" })

最終生成的html如下：

<input class="form-control" data-val="true" data-val-maxlength="字段 EnterpriseNo 必須是最大長度為“30”的字符串或數(shù)組類型。" data-val-maxlength-max="30" data-val-required="信用代碼/注冊號不能為空" id="BasicInfo_EnterpriseNo" name="BasicInfo.EnterpriseNo" placeholder="必填項" value="" data-original-title="" title="" type="text">

標(biāo)簽里面自動加上了很多data-開頭的屬性，data-val表示該控件需要校驗，其它data-開頭的就是一系列校驗規(guī)則和失敗時的錯誤信息，錯誤信息可以自定義，否則框架會給你生成類如“字段 EnterpriseNo 必須是最大長度為30的字符串或數(shù)組類型?！边@種機器翻譯語言。當(dāng)然這些屬性jquery.validate是不認(rèn)的，要讓jquery.validate認(rèn)識，就需要jquery.validate.unobtrusive出馬了。

現(xiàn)在我們來說這些js如何配合使用。

新版本的jquery.validate已經(jīng)支持AMD模式，所以可以直接使用requirejs加載，jquery.validate.unobtrusive