Using AJAX to complete a user name whether there is an asynchronous validation instance

This article mainly introduces the use of Ajax to complete the user name is the existence of asynchronous verification of the relevant data, the need for friends can refer to, hope to help everyone.

Using AJAX to complete a user name is an asynchronous checksum:

1. Event triggering:

* onblur

2. Write the AJAX Code:

* Item action in commit: Pass username parameter

3. Write action

* Receive username: Model-driven receive.

4.* Writing entity classes

* User

* User.hbm.xml

* Configured in spring.

5. Writing DAO

* Inherit Hibernatedaosupport

* Inject sessionfactory into the configuration

6. Write the service:

* Inject Userdao

* Transaction Management:

Core Code implementation:

function Checkusername () {//Get File Box value: var username = document.getElementById ("username"). Value;     1. Create an asynchronous Interaction object var xhr = Createxmlhttp ();           2. Set Listener Xhr.onreadystatechange = function () {if (xhr.readystate = = 4) {if (Xhr.status = = 200) {         document.getElementById ("Span1"). InnerHTML = Xhr.responsetext; }}}//3. Open Connection Xhr.open ("GET", "${pagecontext.request.contextpath}/user_findbyname.action?time=" +new Dat     E (). GetTime () + "&username=" +username,true);   4. Send xhr.send (NULL);       } function Createxmlhttp () {var xmlHttp;       try{//Firefox, Opera 8.0+, Safari xmlhttp=new XMLHttpRequest ();          } catch (e) {try{//Internet Explorer xmlhttp=new activexobject ("msxml2.xmlhttp");          } catch (e) {try{xmlhttp=new ActiveXObject ("Microsoft.XMLHTTP");      } catch (E) {}}} return xmlHttp; }

Public String Findbyname () throws IOException {     //Call service for query:     User existuser = Userservice.findbyusername ( User.getusername ());     Get Response object, item page output:     httpservletresponse response = Servletactioncontext.getresponse ();     Response.setcontenttype ("Text/html;charset=utf-8");     Determine     if (existuser! = null) {       //query to the User: the user name already exists       Response.getwriter (). println ("<font color= ' Red ' > User name already exists </font> ");     } else {       //No query to the User: User name can use       response.getwriter (). println ("<font color= ' green ' > username can be used </font>" );     }     return NONE;   }

Private Userdao Userdao;   public void Setuserdao (Userdao userdao) {     This.userdao = Userdao;   }   Method for querying users by user name: Public user   Findbyusername (String username) {     return userdao.findbyusername (username);   }

Public User Findbyusername (string username) {     string hql = ' from User where username =? ';     list<user> list = This.gethibernatetemplate (). Find (hql, username);     if (list = null && list.size () > 0) {       return list.get (0);     }     return null;   }

<?xml version= "1.0" encoding= "UTF-8"?> <beans xmlns= "Http://www.springframework.org/schema/beans" xmlns:   Xsi= "Http://www.w3.org/2001/XMLSchema-instance" xmlns:context= "Http://www.springframework.org/schema/context" xmlns:aop= "HTTP://WWW.SPRINGFRAMEWORK.ORG/SCHEMA/AOP" xmlns:tx= "Http://www.springframework.org/schema/tx" xsi: schemalocation= "Http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/ Spring-beans.xsd Http://www.springframework.org/schema/context http://www.springframework.org/schema/context/ Spring-context.xsd HTTP://WWW.SPRINGFRAMEWORK.ORG/SCHEMA/AOP http://www.springframework.org/schema/aop/ Spring-aop.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd " > <!--Configure connection pooling:-<!--introduce external property files---<context:property-placeholder location= "Classpath:jdbc.propert ies "/> <!--configuration c3p0 Connection pool:--<bean id=" DataSource "class=" com.mchange.v2.c3p0.Combopooleddatasource "> <property name=" driverclass "value=" ${jdbc.driver} "/> <property name=" JdbcUrl " Value= "${jdbc.url}"/> <property name= "user" value= "${jdbc.user}"/> <property name= "password" value= "$ {Jdbc.password} "/> </bean> <!--hibernate information--<bean id=" sessionfactory "class=" Org.springfram Ework.orm.hibernate3.LocalSessionFactoryBean "> <!--inject connection pool--<property name=" DataSource "ref=" Datasou         Rce "/> <!--Configure other properties of Hibernate--<property name=" Hibernateproperties "> <props> <prop key= "Hibernate.dialect" >org.hibernate.dialect.MySQLDialect</prop> <prop key= "Hibernate.show_ SQL ">true</prop> <prop key=" Hibernate.format_sql ">true</prop> <prop key=" hibernate . Connection.autocommit ">false</prop> <prop key=" Hibernate.hbm2ddl.auto ">update</prop> & Lt;/props> </property> <!--configuring hibernate mapping Files--<property name= "mappingresources" > <list> &L t;value>cn/itcast/shop/user/vo/user.hbm.xml</value> </list> </property> </bean> & lt;! --Transaction management:-<!--transaction Manager--<bean id= "TransactionManager" class= "Org.springframework.orm.hibernate3.Hibern Atetransactionmanager "> <property name=" sessionfactory "ref=" Sessionfactory "/> </bean> <!--opening annotations Transactions--<tx:annotation-driven transaction-manager= "TransactionManager"/> <!--action configuration ================= ==========--> <!--Home Access action--<bean id= "indexaction" class= "cn.itcast.shop.index.action.IndexAction "Scope=" prototype "> </bean> <!--Configure CAPTCHA action---<bean id=" checkimgaction "class=" cn.itcast.shop. User.action.CheckImgAction "scope=" prototype "> </bean> <!--User module action--<bean id=" Useraction " Class= "cn.itcast.shop.usEr.action.UserAction "scope=" prototype "> <!--Inject service--<property name=" UserService "ref=" Userserv Ice "/> </bean> <!--service configuration ===========================--> <bean id=" UserService "class=" CN.ITC  Ast.shop.user.service.UserService "> <property name=" Userdao "ref=" Userdao "/> </bean> <!--DAO configuration ===========================--> <bean id= "Userdao" class= "Cn.itcast.shop.user.dao.UserDao" > <property na Me= "Sessionfactory" ref= "sessionfactory"/> </bean> </beans> [HTML] View plain copy on code to see a snippet derived from my Code slice & lt;? XML version= "1.0" encoding= "UTF-8"?> <! DOCTYPE struts Public "-//apache software foundation//dtd struts Configuration 2.3//en" "Http://struts.apache.org/dtds /struts-2.3.dtd "> <struts> <constant name=" Struts.devmode "value=" false "/> <constant name=" struts. Enable. Dynamicmethodinvocation "value=" true "/> <package name=" shop "extends=" Struts-default"Namespace="/"> <global-results> <result name=" MSG ">/WEB-INF/jsp/msg.jsp</result> < /global-results> <!--configuration Home Access action--<action name= "index" class= "indexaction" > <result Name= "index" >/WEB-INF/jsp/index.jsp</result> </action> <!--Configure the User module action--<action Name= "user_*" class= "useraction" method= "{1}" > <result name= "registpage" >/web-inf/jsp/regist.jsp</ result> <result name= "input" >/WEB-INF/jsp/regist.jsp</result> <result name= "LoginPage" >/w eb-inf/jsp/login.jsp</result> <result name= "Login" >/WEB-INF/jsp/login.jsp</result> <resul T name= "loginsuccess" type= "redirectaction" >index</result> <result name= "quit" type= "Redirectaction"     ;index</result> <result name= "Checkcodefail" >/WEB-INF/jsp/regist.jsp</result> </action>   <!--verification Code action---  <action name= "checkimg" class= "checkimgaction" ></action> </package> </struts> 

Related recommendations;

JavaScript rewrites asynchronous check forms to synchronize forms _javascript tips

Detailed JavaScript traditional method to implement asynchronous check _javascript technique

An example of AJAX implementation of the traditional and $.post way of jquery