昨天寫了一下關於如何在前臺快捷實現表單數據驗證的方法,今天接着昨天的,把後臺實現數據驗證的方法記錄一下。先說明一下哈,我用的是asp.net,因此後臺驗證方法也是基於.net mvc來作的。javascript
好了,閒言少敘,我回到正題上來啦。前端
後臺實現表單數據驗證的方法也是至關簡單的,下面看我一步一步的來作哈。(爲了單純的說明表單驗證的方法,減小其餘沒必要要的內容的說明,這裏我就不涉及數據庫了。)java
1.新建一個.net mvc應用程序ajax
這一步今天就不詳細講了,有時間的話再寫一篇關於如何新建項目和實現簡單增刪改查功能的博客,鞏固本身,順便幫幫和我同樣入地無門的菜雞們。建好的應用程序如圖所示,個人名字起爲FormCheck:正則表達式
2.新建用戶信息字段實體數據類User816.cs數據庫
(這個命名各位不要去糾結他哈,由於我這裏用的不是剛寫的熱乎代碼,而是8月16日寫的冷代碼,由於晚上時間有限,就不從新寫了)mvc
以下圖所示,我在Models文件夾中新建一個User816.cs的實體類,代碼以下:asp.net
1 namespace FormCheck.Models 2 { 3 public class User816 4 { 5 6 public string userName { get; set; } 7 8 public string passWord { get; set; } 9 10 public string eMail { get; set; } 11 12 } 13 }
這裏咱們寫了三個屬性,分別爲用戶名、密碼和郵箱,下面將依次爲這幾個數據添加校驗方法。post
主要添加[Required] ,[ StringLength] ,[RegularExpression] 三個吧,由於這三個是最經常使用的。學習
(1)Required
首先看看這個方法的定義:
這段代碼只須要看到能看懂的漢字就能夠了,沒錯,就是那個 【指定的數據字段的值是必須的】,好了如今咱們知道這個是什麼意思了,那麼問題來了,這個東西怎麼用呢?看下面:
[Required(ErrorMessage ="*必填項")] public string userName { get; set; }
在須要驗證的屬性上面用中括號將Required包起來,而後能夠添加上錯誤提示信息。怎麼樣,是否是很簡單,哈哈。
(2)StringLength
這個也是同樣的,直接看看這個東東的意思和用法,就一筆帶過了吧:
用法以下:
[StringLength(5,ErrorMessage ="*超過長度了") ] public string userName { get; set; }
上面的第一個參數【5】指的是字符串的最大長度 ,固然這裏並非只能設置最大長度,也能夠設置最小長度,不止如此,還有不少其餘的用法,這裏我就不細說了,具體的須要用到的同窗能夠在網上搜索資料。
(3)RegularExpression
這個就比較牛逼了,驗證正則表達式:
用法以下:
[RegularExpression(@"^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$", ErrorMessage = "*郵箱格式錯誤")] //正則表達式 public string eMail { get; set; }
關於這幾個驗證方法就說到這啦,下面咱們看看實際怎麼用咯。
3.驗證數據
(1)在相應屬性上添加想要的驗證:
代碼以下所示:
namespace FormCheck.Models { public class User816 { [StringLength(5,ErrorMessage ="*超過長度了") ] [Required] public string userName { get; set; } [Required(ErrorMessage ="*必填項")] [Range(100,1000000,ErrorMessage ="*數字大小超出範圍了")] public string passWord { get; set; } [Required] [RegularExpression(@"^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$", ErrorMessage = "*郵箱格式錯誤")] //正則表達式 public string eMail { get; set; } } }
(2)在前臺頁面引用User816.cs
首先,在HomeController中新建一個方法,取名爲GetInfo(),而後添加對應的視圖,而後引用User816:
如圖所示:
(3)新建表單
代碼以下:
<div> @using (Html.BeginForm("GetInfoFunc", "Home", FormMethod.Post)) { @Html.ValidationSummary(true) <label class="btn-default">姓名</label> @Html.TextBoxFor(model => model.userName); @Html.ValidationMessageFor(model => model.userName) <br> <label class="btn-default">密碼</label> @Html.TextBoxFor(model => model.passWord); @Html.ValidationMessageFor(model => model.passWord) <br> <label class="btn-default">郵箱</label> @Html.TextBoxFor(model => model.eMail); @Html.ValidationMessageFor(model => model.eMail) <button class="btn-info" id="submit">提交</button> } </div>
上面的代碼中,實現後臺校驗功能的主要是這一句哦,用的時候千萬記得不要搞漏了:
@Html.ValidationMessageFor(model => model.userName) @Html.ValidationMessageFor(model => model.passWord) @Html.ValidationMessageFor(model => model.eMail)
其實只須要這三步已經能夠看到效果了,可是爲了保證一個表單提交demo的完整性,我就再補上第四步啦,哈哈。
(4)前臺提交數據,後臺接收
ajax方式提交表單:
<script type="text/javascript"> $(function () { $("#submit").click(function () { var userName = $("#userName").val(); var passWord = $("#passWord").val(); var eMail = $("#eMail").val(); $.ajax({ url: "@Url.Action("GetInfoFunc", "Home")", type: "post", data: { userName: userName, passWord: passWord, eMail: eMail }, success: function (data) { alert(data); } }); }); }); </script>
後臺建立控制器 GetInfoFunc()接收數據:
[HttpPost] public ActionResult GetInfoFunc() { string userName = Request["userName"]; string passWord = Request["passWord"]; string eMail = Request["eMail"]; return Content(userName + "," + passWord + "," + eMail); }
4.查看結果
這裏實現的效果跟我昨天寫的前端js校驗的方法差很少哦,並且也很是的簡單呢。
好了,今天就寫到這裏啦,好好學習,每天向上,啊哈哈哈哈哈!
個人eMail:3074596466@qq.com