ValidationSugar表單驗證框架的優點:
1、支持javascript端和后端的雙重驗證 (前端目前依賴于jquery.validate.js,也可以自已擴展)
2、代碼簡潔
3、調用方便
4、功能齊全
使用方法:
新建初始化類,將所有需要驗證的在該類進行初始化,語法相當簡潔并且可以統一管理,寫完這個類你的驗證就完成了70%
函數介紹:
Add 默認類型(郵件、手機、QQ等)
AddRegex 正則驗證 在Add無法滿足情部下使用
addFunc 使用js函數進行驗證,一般用于業邏輯的驗證 ,功能非常強大,可以滿足各種驗證(注意:addFunc函數驗證后 后臺需要重新驗證,所以能用上兩種方法驗證的,盡量使用上面的)
using System;using System.Collections.Generic;using System.Linq;using System.Web;using SyntacticSugar;namespace ValidationSuarMVC.Models{ public class Validates { public static void Init() { //login ValidationSugar.Init(PageKeys.LOGIN_KEY, ValidationSugar.CreateOptionItem().Set("userName", true/*是否必填*/, "用戶名").AddRegex("[a-z,A-Z].*", "用戶名必須以字母開頭").AddRegex(".{5,15}", "長度為5-15字符").AddFunc("checkUserName", "用戶名不存在,輸入 admin1 試試").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("passWord", true, "密碼").AddRegex("[0-9].*", "用戶名必須以數字開頭").AddRegex(".{5,15}", "長度為5-15字符").ToOptionItem() ); //register ValidationSugar.Init(PageKeys.REGISTER_KEY, ValidationSugar.CreateOptionItem().Set("userName", true, "用戶名").AddRegex("[a-z,A-Z].*", "用戶名必須以字母開頭").AddRegex(".{5,15}", "長度為5-15字符").AddFunc("checkUserName", "用戶名已存在!").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("password", true, "密碼").AddRegex(".{5,15}", "長度為5-15字符").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("password2", true, "密碼").AddRegex(".{5,15}", "長度為5-15字符").AddFunc("confirmPassword", "密碼不一致").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("sex", true, "性別").AddRegex("0|1", "值不正確").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("email", true, "郵箱").Add(ValidationSugar.OptionItemType.Mail, "郵箱格式不正確").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("mobile", false, "手機").Add(ValidationSugar.OptionItemType.Mobile, "手機格式不正確").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("qq", false, "qq").AddRegex(@"/d{4,15}", "qq號碼格式不正確").ToOptionItem(), ValidationSugar.CreateOptionItem().Set("education", true, "學歷", true/*checkbox 多選模式*/).AddRegex(@"/d{1,15}", "值不正確").ToOptionItem() ); } }}
Global.cs注冊我們就可以用了
驗證大多情況下分兩種
1、submit提交的寫法
Register 一行代碼搞定、獲取綁定信息交給viewbag
PostRegister 也是一行完成后臺驗證
view
1、引用js并寫好初始化函數
2、將@Html.Raw(ViewBag.validationBind) 放在頁面最下方
VIEW完整代碼:
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 | @{
ViewBag.Title = "Register" ;
Layout = null ; } <html xmlns= "http://www.w3.org/1999/xhtml" > <head>
<meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" />
<script src= "/Content/jquery-validation-1.13.1/lib/jquery-1.9.1.js" type= "text/Javascript" ></script>
<script src= "/Content/jquery-validation-1.13.1/dist/jquery.validate.js" type= "text/javascript" ></script>
<script src= "/Content/validation.sugar.js" type= "text/javascript" ></script>
<script src= "/Content/jquery-validation-1.13.1/lib/jquery.form.js" type= "text/javascript" ></script>
<link href= "/Content/jquery-validation-1.13.1/validation.sugar.CSS" rel= "stylesheet"
type= "text/css" />
<script type= "text/javascript" >
$(function () {
var factory = new validateFactory($( "form" ), "<img src=/"/Content/jquery-validation-1.13.1/error.png/" />" );
factory.init();
});
//用戶名是否已存在
function checkUserName() {
//實際開發換成: Ajax async:false
var userName = $( "[name=userName]" ).val();
if (userName == "admin1" || userName == "admin2" ) {
return false ;
}
return true ;
}
|