使用AJAX完成用戶名是否存在異步校驗:
1.事件觸發(fā):
* onblur
2.編寫AJAX代碼:
* 項Action中提交:傳遞username參數(shù)
3.編寫Action
* 接收username:模型驅(qū)動接收.
4.* 編寫實體類
* User
* User.hbm.xml
* 配置到spring中.
5.編寫DAO
* 繼承HibernateDaoSupport
* 在配置中注入sessionFactory
6.編寫Service:
* 注入UserDao
* 事務(wù)管理:
核心代碼實現(xiàn)：
function checkUsername(){
// 獲得文件框值:
var username = document.getElementById("username").value;
// 1.創(chuàng)建異步交互對象
var xhr = createXmlHttp();
// 2.設(shè)置監(jiān)聽
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
document.getElementById("span1").innerHTML = xhr.responseText;
}
}
}
// 3.打開連接
xhr.open("GET","${pageContext.request.contextPath}/user_findByName.action?time="+new Date().getTime()+"username="+username,true);
// 4.發(fā)送
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 {
// 調(diào)用Service進(jìn)行查詢:
User existUser = userService.findByUsername(user.getUsername());
// 獲得response對象,項頁面輸出:
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("text/html;charset=UTF-8");
// 判斷
if (existUser != null) {
// 查詢到該用戶:用戶名已經(jīng)存在
response.getWriter().println("font color='red'>用戶名已經(jīng)存在/font>");
} else {
// 沒查詢到該用戶:用戶名可以使用
response.getWriter().println("font color='green'>用戶名可以使用/font>");
}
return NONE;
}
private UserDao userDao;
public void setUserDao(UserDao userDao) {
this.userDao = userDao;
}
// 按用戶名查詢用戶的方法:
public User findByUsername(String username){
return userDao.findByUsername(username);
}
public User findByUsername(String username){
String hql = "from User where username = ?";
ListUser> 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">
!-- 配置連接池: -->
!-- 引入外部屬性文件 -->
context:property-placeholder location="classpath:jdbc.properties"/>
!-- 配置C3P0連接池: -->
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的相關(guān)信息 -->
bean id="sessionFactory" class="org.springframework.orm.hibernate3.LocalSessionFactoryBean">
!-- 注入連接池 -->
property name="dataSource" ref="dataSource"/>
!-- 配置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>
/props>
/property>
!-- 配置Hibernate的映射文件 -->
property name="mappingResources">
list>
value>cn/itcast/shop/user/vo/User.hbm.xml/value>
/list>
/property>
/bean>
!-- 事務(wù)管理: -->
!-- 事務(wù)管理器 -->
bean id="transactionManager" class="org.springframework.orm.hibernate3.HibernateTransactionManager">
property name="sessionFactory" ref="sessionFactory"/>
/bean>
!-- 開啟注解事務(wù) -->
tx:annotation-driven transaction-manager="transactionManager"/>
!-- Action的配置 ===========================-->
!-- 首頁訪問的Action -->
bean id="indexAction" class="cn.itcast.shop.index.action.IndexAction" scope="prototype">
/bean>
!-- 配置驗證碼Action -->
bean id="checkImgAction" class="cn.itcast.shop.user.action.CheckImgAction" scope="prototype">
/bean>
!-- 用戶模塊的Action -->
bean id="userAction" class="cn.itcast.shop.user.action.UserAction" scope="prototype">
!-- 注入Service -->
property name="userService" ref="userService"/>
/bean>
!-- Service的配置 ===========================-->
bean id="userService" class="cn.itcast.shop.user.service.UserService">
property name="userDao" ref="userDao"/>
/bean>
!-- Dao的配置 ===========================-->
bean id="userDao" class="cn.itcast.shop.user.dao.UserDao">
property name="sessionFactory" ref="sessionFactory"/>
/bean>
/beans>
[html] view plain copy 在CODE上查看代碼片派生到我的代碼片
?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>
!-- 配置首頁訪問的Action -->
action name="index" class="indexAction">
result name="index">/WEB-INF/jsp/index.jsp/result>
/action>
!-- 配置用戶模塊的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">/WEB-INF/jsp/login.jsp/result>
result name="login">/WEB-INF/jsp/login.jsp/result>
result name="loginSuccess" type="redirectAction">index/result>
result name="quit" type="redirectAction">index/result>
result name="checkcodeFail">/WEB-INF/jsp/regist.jsp/result>
/action>
!-- 驗證碼Action -->
action name="checkImg" class="checkImgAction">/action>
/package>
/struts>
以上所述是小編給大家介紹的使用AJAX完成用戶名是否存在異步校驗，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
您可能感興趣的文章:- ThinkPHP框架結(jié)合Ajax實現(xiàn)用戶名校驗功能示例
- ajax實現(xiàn)用戶名校驗的傳統(tǒng)和jquery的$.post方式(實例講解)
- ajax設(shè)置async校驗用戶名是否存在的實現(xiàn)方法
- jquery easyUI中ajax異步校驗用戶名
- SSH網(wǎng)上商城之使用ajax完成用戶名是否存在異步校驗
- Ajax校驗用戶名是否存在的方法
