Real-time Ajax application registration User Detection

The refreshing mechanism of Ajax enables real-time display of Registration Name detection in the registration system.

Common User Registration is the user input user name, BackgroundProgramCheck whether the user name in the database is repeated and prompt registration Success and Failure (when the user name is registered again, it will return a re-registration ), you can also add a detection button after the User Name text box to enable user detection before registration.

The above operations are "poor" in terms of user experience. A good user experience is that after the user enters the registered user name, the web system should be able to check and display the user name in real time, the check and display operations on the current page are not affected. This is the requirement for "Asynchronous Data Acquisition", which is the strength of Ajax.

For example, the following example shows the function of Ajax:

Http://www.cnbruce.com/test/ajax/t1.htm

When you enter an existing user name (such as cnbruce and cnrose), the page will show that the user name cannot be registered (false); otherwise, the user can be registered (true ), this provides a quick reference for user registration, with the highest user experience.

The following describes how to implement such a function.

T1.htmSource codeYou can see the essence of Ajax.

First, define the XMLHTTP object

VaR XMLHTTP = false; Try { XMLHTTP = new activexobject ("msxml2.xmlhttp "); } Catch (e ){ Try { XMLHTTP = new activexobject ("Microsoft. XMLHTTP "); } Catch (E2 ){ XMLHTTP = false; } } If (! XMLHTTP & typeof XMLHttpRequest! = 'Undefined '){ XMLHTTP = new XMLHttpRequest (); }

For details about this part, refer:
Http://www.cnbruce.com/blog/showlog.asp? Cat_id = 34 & log_id = 987

Next is the custom function.

Function callserver (){ VaR u_name = Document. getelementbyid ("u_name"). value; If (u_name = NULL) | (u_name = "") return; VaR url = "cu. asp? Name = "+ escape (u_name ); XMLHTTP. Open ("get", URL, true ); XMLHTTP. onreadystatechange = updatepage; XMLHTTP. Send (null ); }

The main function of this function is to obtain the Cu asynchronously. ASP content. Before that, the value of the "u_name" text box zhogn is extracted from the form element of the current page. the parameters and values after ASP get different results (true or false ).

Callback is obtained asynchronously.

<! -- Cu. ASP source code example --> <! -- # Include file = "conn. asp" --> <% Name = request. querystring ("name ") Set rs = server. Createobject ("ADODB. recordset ") SQL = "select * From u_ser where u_name = '" & name &"'" Rs. Open SQL, Conn, 1, 1 If Rs. EOF and Rs. bof then Response. Write ("true ") Else Response. Write ("false ") End if Rs. Close Set rs = nothing Call closedatabase %>

How can I display the information obtained asynchronously on the current page?

Function updatepage (){ If (XMLHTTP. readystate <4 ){ Test1.innerhtml = "loading ..."; } If (XMLHTTP. readystate = 4 ){ VaR response = XMLHTTP. responsetext; Test1.innerhtml = response; } }

The readystate in XMLHTTP. readystate indicates the progress of the server when processing the request. The value ranges from 0 to 4, respectively. For details, see:

Http://www.cnbruce.com/blog/showlog.asp? Cat_id = 34 & log_id = 718

Use innerhtml in DHTML to display information on the defined <span id = "test1"> whether to register </span>.

The rest of the form pages are not detailed.

Download the package file (after the download, change the suffix. cnbruce to. rar ):

Http://www.cnbruce.com/test/ajax/ajax.cnbruce