1, create a project, named MyLogin, choose an empty template
2, create a controller, named home.
3. Create a (home) view for the method index in the controller, named index.
4. Modify the content in the view index
5. Add a method named Login.
6. For the method login, add a view named login.
7. Change routing
8. Add a method Login1 with two parameters for the controller, and modify the contents.
9. Find the Content folder and the following jquery and Ligerui folders, if not, you need to add the content folder and its contents from somewhere else
10. Add formatting by dragging and dropping
11, change the contents of the view login, the code is as follows:
<! DOCTYPE html>
<meta name= "viewport" content= "Width=device-width"/>
<title> Landing Page </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"/>
<body>
<div id= "Login" > <!--Create a block with ID login---->
<div id= "Form" ></div> <!------block login inside an ID is a block of form----->
<span id= "Tip" ></span> <!------------a span--------named Tip >
</div>
<script type= "Text/javascript" >
$ (function () {
Create a form structure
$ ("#form"). Ligerform ({
Fields: [
{display: "username", Name: "UserName", Newline:false, type: "Text",},
{display: "Password", Name: "Password", Newline:true, type: "Password",}
],
});
Create a dialog window
$.ligerdialog.open ({
Target: $ ("#login"),
Title: "Login System",
Allowclose:false,
Buttons: [
{
Text: ' Login system ', onclick:function () {//Dialog window named "Login System"
var form = liger.get ("form");
var data = Form.getdata (); The values of the form are assigned to data
if (data. UserName = = "" && data. Password = = "") {//Validation input: Input empty response
$ ("#tip"). HTML ("User name and password cannot be null");
return false;
};
$.post ("/home/login1", data, function (result) {
if (result. SUCC = = 1) {
Window.document.location.href = "/home/index"; Validate input: Enter the correct response
}
else {
$ ("#tip"). HTML ("User name or password error"); Validation input: Input wrong response
}
});
}
},
]
});
});
</script>
</body>
12, debugging, check the effect of operation
When the input is empty:
When an error is entered:
Input correct:
ASP. NET MVC C # ligerui Implement user Login function login
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
