Because the work needs to study js ajax, the following is the result.
There are three main parts:
1. js friendly tips: Pay attention to the return false in $ ("# btn_login") in js; this can prevent the revolving server from refreshing.
Copy codeThe Code is as follows:
$ (Document). ready (function (){
$ ("# Btn_login"). click (function (){
Postlogin ();
Return false;
});
});
Function postlogin (){
If (checkUserName () & checkUserPwd ()){
Var username = $ ('# txt_loginname'). val ();
Var userpass = $ ('# txt_loginpass'). val ();
$. Post (".../UserLogin. aspx", {UserName: username, UserPass: userpass}, function (result ){
If (result = "1 "){
Alert ("Logon successful! ");
} Else if (result = "3 "){
Alert ("the user name is incorrect! ");
} Else if (result = "2 "){
Alert ("Incorrect password! ");
} Else {
Alert ("Logon Failed! Please try again! "+ Result );
}
});
}
}
Function checkUserName (){
If ($ ("# txt_loginname"). val (). length = 0 ){
Alert ('user name cannot be blank! ');
Return false;
} Else {
Return true;
}
}
Function checkUserPwd (){
If ($ ("# txt_loginpass"). val (). lenght = 0 ){
Alert ('the password is incorrect! ');
Return false;
} Else {
Return true;
}
}
Ii. Page
Copy codeThe Code is as follows:
<Table width = "100%" border = "0" cellspacing = "0" cellpadding = "0">
<Tr>
<Td width = "32%" height = "37" valign = "middle"> User name: </td>
& Lt; td width = "68%" valign = "middle" & gt;
<Input type = "text" name = "txt_loginname" id = "txt_loginname" class = "input_1"/>
</Td>
</Tr>
<Tr>
<Td height = "37" valign = "middle"> password: </td>
<Td valign = "middle">
<Input type = "password" name = "txt_loginpass" id = "txt_loginpass" class = "input_2"/>
</Td>
</Tr>
<! -- <Tr>
<Td height = "37" valign = "middle"> Verification Code: </td>
<Td valign = "middle">
<Input type = "text" name = "textfield3" id = "textfield3" class = "input_3" style = "float: left"/>
<Span style = "float: left; margin-left: 6px;"> </span> </td>
</Tr> -->
<Tr>
<Td colspan = "2">
<Input type = "image" name = "btn_login" id = "btn_login" src = "images/img_4.gif"/>
<Input type = "image" name = "input" src = "images/img_5.gif"/>
<Input type = "image" name = "input" src = "images/img_6.gif"/>
</Td>
</Tr>
</Table>
3. The background section is the page for processing login information in js.
Copy codeThe Code is as follows:
Protected void Page_Load (object sender, EventArgs e)
{
String username = Request. Form ["UserName"];
String userpass = Request. Form ["UserPass"];
T_User user = UserManager. loginpassword (username, userpass );
If (user! = Null)
{
Session ["user"] = user;
Response. Write ("1"); // login successful
Response. End ();
}
Else
{
If (UserManager. OnlyOne (username)> = 1)
{
Response. Write ("2"); // The password is incorrect.
Response. End ();
}
Else
{
Response. Write ("3"); // the user name does not exist
Response. End ();
}
}
}