首頁 > 開發者 > ASP

asp.net MVC C# LIgerUI實現使用者登入功能login

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

標籤：

1、建立一個項目，命名為MyLogin，選擇空模板

2、建立一個控制器，命名為Home。

3、為控制器裡的方法Index建立一個（首頁）視圖，命名為Index。

4、在視圖Index裡修改內容

5、添加一個方法命名為Login。

6、為方法Login添加一個視圖命名為Login。

7、更改路由

8、為控制器添加一個有兩個參數的方法Login1，並修改內容。

9、找到content檔案夾及其下面的jquery和ligerui檔案夾，如果沒有，則需要從其他地方先添加content檔案夾及其內容

10、通過拖拽，添加格式

11、更改視圖Login的內容，代碼如下：

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>登陸頁面</title>
<script src="~/Content/jquery/jquery-1.9.0.min.js"></script>
<script src="~/Content/ligerui/ligerui.min.js"></script>
<script src="~/Content/ligerui/ligerui.all.js"></script>
<link href="~/Content/ligerui/skins/Aqua/css/ligerui-all.css" rel="stylesheet" />
</head>
<body>
<div id="login"> <!--建立一個id為login的塊---->
<div id="form"></div> <!------塊login內部一個id為form的塊----->
<span id="tip"></span> <!------------一個名為tip的span-------->
</div>
<script type="text/javascript">
$(function () {


//建立表單結構
$("#form").ligerForm({

fields: [
{ display: "使用者名稱", name: "UserName", newline: false, type: "text", },
{ display: "密碼", name: "Password", newline: true, type: "password", }
],

});

//建立交談視窗
$.ligerDialog.open({
target: $("#login"),

title: "Login System",
allowClose: false,
buttons: [
{
text: ‘登入系統‘, onclick: function () { //交談視窗的名字為“登入系統”
var form = liger.get("form");
var data = form.getData(); //表單的值賦給data

if (data.UserName == "" && data.Password == "") { //驗證輸入：輸入為空白的回應
$("#tip").html("使用者名稱和密碼不可為空");
return false;
};

$.post("/Home/Login1", data, function (result) {
if (result.Succ == 1) {
window.document.location.href = "/Home/Index"; //驗證輸入：輸入正確的回應
}
else {
$("#tip").html("使用者名稱或密碼錯誤"); //驗證輸入：輸入錯誤的回應
}
});
}
},

]
});

});
</script>
</body>
</html>

12、調試，查看運行效果

輸入為空白時：

輸入錯誤時：

輸入正確：

 

asp.net MVC C# LIgerUI實現使用者登入功能login

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More