Jquery $. ajax user logon example

Example 1: log on directly using $. ajax

The code is as follows:

Copy code

$. Ajax ({ // Submit the address Url :"", // Submitted data Data: {key1: value1, key2: value2, key3: value3, key4: value4 }, // Events before submission BeforeSend: function (){ Login. hide (); ShowInfo.html (loginInfo ); }, // Submission method Type: "POST ", // Submitted data type DataType: "json ", // Events after submission Success: function (result ){ If (result. State. toString () = "success" & result. IsLogin. toString () = "1 "){ ShowInfo. addInfoMsg ("logon successful! Redirecting ..."); Window. location. href = "/Default. aspx ";             } Else { Login. show (); ShowInfo. addShowMsg (result. exMsg. toString ());             } }, // Submission error time Error: function (httpRequest, textStatus, errorThrown ){ ShowInfo. addShowMsg ("system error. Please log on again! "); Login. show ();         } }); Returned data format: // Format of the returned data Var returnInfo = "\" State \ ": \" {0} \ ", \" IsLogin \ ": \" {1} \ ", \" exMsg \": \ "{2 }\""; Context. Response. Write ("{" + String. Format (returnInfo, "success", "1", "login successful! ") + "}"); Context. Response. Write ("{" + String. Format (returnInfo, "fail", "0", "username cannot be blank") + "}"); Context. Response. Write ("{" + String. Format (returnInfo, "fail", "0", "password cannot be blank") + "}"); Context. response. write ("{" + String. format (returnInfo, "fail", "0", "you are not authorized to log on to the system. Contact your administrator. ") + "}"); Context. Response. Write ("{" + String. Format (returnInfo, "fail", "0", "illegal login," + ex. Message + "}"));

This principle is very simple to submit data to asp file processing. When asp accesses the submitted data, we can judge it. If there is no problem with the user name and password, the session will be written and the status code will be returned, after the front-end js is judged by js, the page is displayed with a complete ajax login function.

Look at an original method

Js code

The code is as follows:

Copy code

<Scr limit pt language = "limit Cr limit pt"> Function postRequest (strURL ){ Var xmlHttp; If (window. XMLHttpRequest) {// For Mozilla, Safari ,... Var xmlHttp = new XMLHttpRequest (); } Else if (window. ActiveXObject) {// For Internet Explorer Var xmlHttp = new ActiveXObject ("Microsoft. XMLHTTP "); } XmlHttp. open ('post', strURL, true ); XmlHttp. setRequestHeader ('content-type', 'application/x-www-form-urlencoded '); XmlHttp. onreadystatechange = function (){ If (xmlHttp. readyState = 4 ){ Updatepage (xmlHttp. responseText ); } } XmlHttp. send (strURL ); } Function updatepage (str ){ If (str = "yes "){ Alert ("Welcome User "); } Else { Alert ("Invalid Login! Please try again! "); } } Function call_login (){ Var username = parameter doc ument. f1.username. value; Var password = parameter doc ument. f1.password. value; Var url = "login. php? Username = "+ username +" & password = "+ password; PostRequest (url ); } </Scr platinum pt>

Html code

Login. php:

The code is as follows:	Copy code
<? $ Username = $ _ GET ["username"]; $ Password = $ _ GET ["password"]; If ($ username = "admin" & $ password = "admin "){ Echo "yes "; } Else { Echo "No "; } ?>

In the following example, no operation is performed on the database. Of course, this problem does not occur in the application and you need to operate the database.