ASP.NET MVC+EF框架+EasyUI實現權限管系列
(開篇) (1):框架搭建 (2):數據庫訪問層的設計Demo (3):面向接口編程 (4 ):業務邏輯層的封裝
(5):前台Jquery easyUI實現 (6):EF上下文實例管理 (7):DBSession的封裝 (8):DBSession線程內唯一
(9):TT摸版的學習 (10):VSS源代碼管理 (11):驗證碼實現和底層修改 (12):實現用戶異步登錄和T4模板
(13):權限設計 (14):主框架搭建 (15):權限數據庫模型和用戶登錄詳細錯誤 (16):用戶注冊的各種驗證
前言:昨天我們簡單的介紹了一下在解決方案中建立虛擬的文件夾和將各個類庫生成的DLL文件放到一個統一的文件夾中,還有我們就是介紹了用戶的注冊功能,不過由於篇幅的原因,上篇博客我只是說到了用戶可以注冊成功,但是很多細節性的東西我都沒有寫出來,今天我就將這些驗證信息全部寫出來吧,也方便大家以后自己做驗證的時候用,並且也修改了一部分的代碼,使用了JavaScript自帶的功能來實現的,下面我們就開始講述我們今天的內容。
1. 使用Jquery構造Json串發給后台
(1)大家如果看我上一篇博客的話,大家可能會注意的我是怎么獲取到前台的數據並且構造成Json串傳遞給后台的呢?下面看這段代碼:
1 //獲取參數傳遞給前台 2 3 //var postData = { 4 5 // UserName: $("#UserName").val(), 6 7 // RealName: $("#RealName").val(), 8 9 // UserPassword: $("#UserPassword").val(), 10 11 // Email: $("#Email").val(), 12 13 // SecurityLevel: $("#SecurityLevel").combobox('getValue'), 14 15 // Gender: $('input[name="Gender"]:checked').val(), 16 17 // Birthday: $("#Birthday").datebox('getValue'), 18 19 // Mobile: $("#Mobile").val(), 20 21 // Telephone: $("#Telephone").val(), 22 23 // QICQ: $("#QICQ").val(), 24 25 // SortCode: $("#SortCode").val(), 26 27 // Description: $("#Description").val() 28 29 //};
(2)我就是通過這種方法將我再前台輸入的參數傳遞給后台的,但是這樣的話如果我們頁面有很多信息要傳遞給后台的話,那么是不是看起來非常冗余呢,這樣的話就有了我下面說的解決方法。
(3)如果我們發送的表單是以Form形式發送的話,那么我們可以直接序列化表單,Jquery提供了這樣的函數,我們只需要一句話就能夠將所有的參數傳遞過去,這一句話如下:var postData = $("#ff").serializeArray();,但是如果沒有form表單的話那么我們只好這樣老老實實的這樣寫了,如果大家有什么好的方法可以給我說一下,謝謝大家。
2.EasyUI當第二次添加的時候啟動窗體第一次的值還存在
(1)在我以前寫代碼的時候就遇到了這個問題了,可能我標題描述的不是很清楚,那就是當我們第一次添加用戶信息的時候,然后我們不要進行任何操作,馬上添加第二次用戶的信息的時候,第一次的信息還在所有的文本框中,所以這樣的話是嚴重的影響我們的Bug。那么我以前的寫法就是寫一個JS的方法,此方法實現了清除所有的文本框的值,然后當我們在彈起來添加用戶的界面的時候,執行這個清空的方法,那么這樣的話文本框就為空了,但是EasyUI也提供了一種清除所有文本框的方法,如果我們的表單里面有form屬性的話,我們完全可以直接輸入一段代碼去解決我們上面的問題,而不用去定義一個方法,然后調用方法去執行,這段代碼就是:$("#ff").form("clear");
(2)當我們添加用戶完畢的時候,我們就調用這個方法來執行,代碼如下:
1 $.post("/UserInfo/RegisterUser", postData, function (data) { 2 3 if (data = "OK") { 4 5 //添加成功 1.關閉彈出層,2.刷新DataGird 6 7 alert("添加成功"); 8 9 $("#DivAddUser").dialog("close"); 10 11 $("#test").datagrid("reload"); 12 13 $("#ff").form("clear"); 14 15 } 16 17 else { 18 19 alert("添加失敗,請您檢查"); 20 21 } 22 23 });
3.驗證登錄用戶名不能重復
(1)現在做網站或者系統,大部分注冊的時候都是不會允許登錄的用戶名重復的,因為如果一旦重復的話將可能出現一些事情,比如某兩個用戶注冊的時候登錄名和密碼都寫成了一樣,這樣的當某一個用戶登錄的時候可能會登錄到別人的系統中去,這樣是萬萬不行的,如果這樣的話,那么進入到這個系統中的用戶不管你是不是這個系統,你都可以進行操作。這樣的話我們就要想辦法解決這些事情。
(2)根據上面的需求,下面我們就需要做出一個驗證用戶名不能為空的需求,首先我們就要想一下怎么做,這個我就想寫簡單點,我的思路就是當用戶的鼠標焦點一離開輸入登錄用戶名的控件的時候就去觸發一個事件到后台去檢驗用戶輸入的信息是否重復,如果重復,則提示錯誤(這個錯誤可以做的好看一點,我為了實現功能,就不好看了,直接彈出一個提示框即可),負責就能夠通過驗證。
(3)根據上面我們所描述的,現在我們開始實現功能,首先我們是去首頁當頁面初次刷新的時候我們就去使用異步方法觸發這個事件,方法代碼如下:
1 //檢測注冊用戶登錄名不能重復 2 3 function CheckUserName() { 4 5 //實現對用戶名不能重復的驗證,如果用戶名稱相同的話則報錯,負責添加成功 6 7 $("#UserName").blur(function () { 8 9 //得到驗證控件的值 10 11 var UserNameCheck = $("#UserName").val(); 12 13 //發送異步請求去驗證用戶名不能重復 14 15 $.get("/UserInfo/CheckUserName", { UserName: UserNameCheck }, function (date) { 16 17 if (date == "OK") { 18 19 alert("該用戶已經存在"); 20 21 $("#UserName").val(""); 22 23 return; 24 25 } 26 27 }); 28 29 }); 30 31 }
(4)然后我們會去控制器中書寫實現判斷用戶是否重復的方法,控制其中的主要代碼如下:
1 //驗證用戶名不能重復 2 3 public ActionResult CheckUserName(string UserName) 4 5 { 6 7 var checkUserName = _userInfoService.CheckUserNameTest(UserName); 8 9 if (checkUserName == LoginResult.OK) 10 11 { 12 13 return Content("error"); 14 15 } 16 17 return Content("OK"); 18 19 }
(5)然后我們回去業務邏輯層實現這個功能,業務邏輯層的代碼如下:
1 //判斷用戶名不能重復 2 3 public LoginResult CheckUserNameTest(string UserName) 4 5 { 6 7 //首先判斷是否為空 8 9 if (String.IsNullOrEmpty(UserName)) 10 11 { 12 13 return LoginResult.UserIsNull; 14 15 } 16 17 var checkUserName = _DbSession.BaseUserRepository.LoadEntities(u => u.UserName == UserName).FirstOrDefault(); 18 19 if (checkUserName != null) 20 21 { 22 23 return LoginResult.UserExist; 24 25 } 26 27 else 28 29 { 30 31 return LoginResult.OK; 32 33 } 34 35 }
(6)到這里我們就完成了用戶名不能重復的驗證,下面我就以hyl為例測試一下,因為hyl我已經注冊過了,截圖如下:
(7)當然Jquey也提供了專門的函數來實現這個功能,函數就是Remote,至於怎么實現,我還沒有研究,如果大家有這樣寫的,不妨發一下代碼我們大家看一下。
4.密碼和確認密碼必須一致
(1)上面這個我想大家基本上都遇見過,用戶名和密碼不能為空,大家可能奇怪我為什么拿出來這個說呢,其實大部分人寫的時候是一個一個的去判斷的,但是我這里就不判斷了,我直接去寫J一個query方法來實現這個功能,方法如下:
1 //驗證用戶兩次輸入的密碼是否相同 2 3 function checkPwdAndOKPwdIsEqualTo() { 4 5 $.extend($.fn.validatebox.defaults.rules, { 6 7 //判斷必須和某個字段相同 8 9 equalTo: { 10 11 validator: function (value, param) { 12 13 return $('#' + param[0]).val() == value; 14 15 }, 16 17 message: '字段不匹配' 18 19 } 20 21 }); 22 23 }
(2)大部分的方法都是這樣寫的,你也可以在這里擴展很多東西,我就不說了,當寫完這個方法的時候,你就可以去修改確認密碼的文本框的代碼,代碼如下:
<input class="easyui-validatebox" type="text" id="OKUserPassword" name="OKUserPassword" data-options="required:true" validType="equalTo['UserPassword']" invalidMessage="兩次輸入的密碼不匹配" />
(3)現在當你添加用戶信息的時候,系統就回去驗證密碼是否一致,如果一致才能通過驗證,負責就會報錯,通過不了驗證。
5.EasyUI的其它驗證
(1)至於我既然已經用了EasyUI的框架來實現這個系統,那么我們的驗證也就是用EasyUI的驗證了,大部分東西我建議大家可以去網上找找,我這里要說的是當我們的控件定義好了各種驗證的時候,這時候當我們單擊保存用戶的時候就因該觸發這個驗證的方法去驗證各種信息,代碼如下:
$("#btnRegist").click(function () {
//判斷用戶的信息是否通過驗證
var validate = $("#ff").form('validate');
if (validate == false) {
return false;
}
}
6.小結
(1)到這里我們今天的內容基本上就算完事了,今天的內容比較簡單,但是都是一些細節性的問題,俗話說的好,細節決定成敗,如果大家感覺我哪里說的不對,請盡管提出來,如果大家不提出來,我們又怎么能進步呢?
(2)這篇博客的主要驗證基本都是根據JS來驗證的,大家懂的。
(3)最好,給大家展示一下我的計划圖紙,本來想找一個BugTrack軟件存放的,但是很遺憾沒找到什么好的,所以暫時用txt文件存放了,等以后有時間寫一個Winform的簡單BugTrack系統。
源碼下載
(1):完整源碼下載
Kencery返回本系列開篇