简单的用户登录（一）
用來實(shí)現(xiàn)一個(gè)用戶登錄，這里要實(shí)現(xiàn)的是，輸入用戶名和密碼，提交后，驗(yàn)證兩者是否正確。
這里直接對(duì)表單提交的二者進(jìn)行字符串判斷，不涉及商業(yè)層活動(dòng)。
實(shí)現(xiàn)項(xiàng)：
1 表單提交
2 獲取表單提交值
3 客戶端判斷不為空
4 添加Css樣式
?
（1）?????? 在View下添加Self文件夾，并在此文件夾中添加 添加Login視圖
1 在視圖中添加文本框，按鈕
2 在Content文件夾中添加Css文件，取名base.css
隨便添加幾項(xiàng)對(duì)視圖Login中元素的樣式定義
3 在視圖中添加對(duì)base.css的引入
方法一：傳統(tǒng)方式
<link href="http://www.cnblogs.com/Content/base.css" rel="stylesheet" type="text/css" />
方法二：
<%=Url.Content("~/Content/base.css") %>（Url對(duì)象的Content方法，用于返回路徑。可用于其它類似資料的引入）[推薦]
4 以下為Login視圖的代碼
//---------------------------------------------------------------------------------------
<div>
??? <% Html.BeginForm("valiLogin","Self",FormMethod.Post); %>
??? <div>用戶登錄</div>
??? <div class="divMargin"><span class="spanHeader">用戶帳號(hào)：</span>
??? <%= Html.TextBox("tbxUserName") %>
??? </div>
??? <div class="divMargin"><span class="spanHeader">用戶密碼：</span>
??? <%= Html.Password("tbxUserPw") %>
??? </div>
??? <div class="divMargin"><input type="submit" value="登錄" id="btnlogin"/></div>
??? <% Html.EndForm(); %>
</div>
//----------------------------------------------------------------------------------------
表單部分：BeginForm方法第一個(gè)參數(shù)為：提交到的頁（視圖）； 第二個(gè)參數(shù)為：控制器名；第三個(gè)參數(shù)：提交動(dòng)作類型，這里是Post
5 添加ajax驗(yàn)證。用于客戶端驗(yàn)證用戶帳號(hào)和密碼不能為空。
這里只驗(yàn)證用戶名不能為空。
先添加jquery庫。
方法用Url.Content方法
<script type="text/javascript" src="<%=Url.Content("~/scripts/jquery-1.3.2-vsdoc.js") %>"></script>
(流行的js框架放在Scripts文件夾中)
先在Content文件夾中添加selfJs文件夾，用于存放js文件。新建valiUser.js
腳本內(nèi)容為：
//---------------------------------------------------------------------------------
$(document).ready(function() {
$("#btnlogin").bind("click", function() {
if ($("#tbxUserName").val() == "") {
??????????? alert("用戶帳號(hào)不能為空！");
??????????? return false;
??????? }
??????? return true;
??? });
})
//---------------------------------------------------------------------------------
把文件引入到Login視圖中
???? <script type="text/javascript" src="<%=Url.Content("~/Content/selfjs/valiUser.js")%>"></script>
（2）?????? 添加控制器
在Controllers文件夾中添加Self控制器。
添加Action
public ActionResult Login()
{
?? return View();
}
（3）?????? 添加路由
在Global.asax中添加
routes.MapRoute(
??????????????? "Login",
??????????????? "{controller}/{action}/{id}",
??????????????? new { controller="Self",action="Login",id=""}
??????????????? );
（4）?????? 添加驗(yàn)證用戶信息視圖
就是提交頁那個(gè)提交頁（視圖）
<% Html.BeginForm("valiLogin","Self",FormMethod.Post); %>
先添加valiLogin視圖；然后在Self控制器中添加驗(yàn)證。驗(yàn)證如下：
public ActionResult valiLogin()
{
string strUser = Request.Form["tbxUserName"];
if (strUser == "qq")
{
??? ViewData["ok"] = "登錄成功";
?}
?else
?{
??? ViewData["ok"] = "登錄不成功";
?}
return View();
}
完成。
總結(jié)：一個(gè)簡單的mvc登錄示例。這里只用于MVC中的VC
涉及到：
1 表單提交與獲取表單
2 客戶端驗(yàn)證
3 視圖，控制器，路由關(guān)系
4 資源引入
下一個(gè)例子將涉及到數(shù)據(jù)庫信息
總結(jié)
以上是生活随笔為你收集整理的简单的用户登录（一）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 利用Excel VBA畫出所有圖標
- 下一篇： IT职业教育行业报告