Jquery instance learning series (1): Ajax login verification

This article uses an Ajax login instance to learn about jquery's Ajax applications.

// Front-endCode

<Script language = "JavaScript">
$ (Document). Ready (
Function (){
$ ("# Btnlogin"). Click (function () {login ();})
}
);

Function login ()
{
If (check ())
{
Go ();
}
}
Function check ()
{
If ($ ("# txtuserid"). Val () = "")
{
Alert ("the account cannot be blank! ");
$ ("# Txtuserid"). Focus ();
Return false;
}
If ($ ("# txtpass"). Val () = "")
{
Alert ("the password cannot be blank! ");
$ ("# Txtpass"). Focus ();
Return false;
}
Return true;
}

Function go ()
{
$. Post ("logincheck. aspx ", {Action:" Post ", userid: $ (" # txtuserid "). val (), userpass: $ ("# txtpass "). val ()},
Function (data, textstatus ){
Alert (data. Result );
"JSON ");

}
</SCRIPT>

// Logincheck. aspx. CS

Using system;
Using system. Data;
Using system. configuration;
Using system. collections;
Using system. Web;
Using system. Web. Security;
Using system. Web. UI;
Using system. Web. UI. webcontrols;
Using system. Web. UI. webcontrols. webparts;
Using system. Web. UI. htmlcontrols;

/// <Summary>
/// Provided by dotbbs. net
/// A. Strong http://www.cnblogs.com/aqiang
/// </Summary>
Public partial class logincheck: system. Web. UI. Page
{
Protected void page_load (Object sender, eventargs E)
{
If (! Ispostback)
{
String retval = "";
String userid = request ["userid"];
String userpass = request ["userpass"];
If (userid = "cyq" & userpass = "000000 ")
{
Retval = "Result: 'success '";
}
Else
{
Retval = "Result: 'fail '";
}
// Response. contenttype = "application/JSON ";
// Response. Write (retval );

Response. contenttype = "application/JSON ";
Response. Write ("{" + retval + "}");

}
}
}

ProgramAnalysis:
Mainly used jquery functions, jquery. Post (URL, [data], [callback], [type]): Use post for asynchronous requests
Parameters:

URL (string): the URL of the request.

Data (MAP): (optional) data to be sent to the server, expressed in key/value pairs.

Callback (function): (optional) callback function when the load is successful (this method is called only when the response returns success ).

Type (string): (optional) the official description is: type of data to be sent. In fact, it should be the client request type (JSON, XML, and so on)

 

$. Post ("logincheck. aspx ", {Action:" Post ", userid: $ (" # txtuserid "). val (), userpass: $ ("# txtpass "). val ()},
Function (data, textstatus ){
Alert (data. Result );
"JSON ");

Note:

1 The HTML tag in the logincheck. ASPX page of the Ajax background program must be deleted.
2. The JSON format must contain "{}";

(C) cnblogs.com/aqiang dotbbs.net

Download instance