1.事件触发--onblur
<td><!-- onblur用户离开输入框的时候执行 -->
<input type="text" id="username" name="username" class="text" maxlength="20" οnblur="checkUsername()">
<span id="span1"></span>
</td>
2.编写Ajax代码
//使用Ajax完成用户名是否异步的校验
function checkUsername(){
//获得文本框的值
var username=document.getElementById("username").value;
//1.创建异步交互对象Xml
var xhr=createXmlHttp();
//2.设置监听
xhr.onreadystatechange=function(){
// 0 未连接 1 打开连接 2 发送请求 3 交互 4 完成交互,接手响应
if (xhr.readyState==4){
if(xhr.status==200){//表示处理结果ok
document.getElementById("span1").innerHTML=xhr.responseText;
}
}
}
//3.打开链接
xhr.open("GET","${pageContext.request.contextPath}/user_findByName.action?time="+new Date().getTime()+"&username=" +username,true);
//4.发送
xhr.send(null);
}
function createXmlHttp(){
var xmlHttp;
try{ //Firefox ,Opera 8.0+,Safari
xmlHttp=new XMLHttpRequest("Msxml2.XMLHTTP");
}catch(e){
try{ //Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
}
}
}
return xmlHttp;
}
3.编写Action
接受username:模型驱动接受
import cn.itcast.shop.user.service.UserService;
import cn.itcast.shop.user.vo.User;
import com.opensymphony.xwork2.ActionSupport;
/*
* 用户模块Action的类
* @author 王美
*
*/
import com.opensymphony.xwork2.ModelDriven;
public class UserAction extends ActionSupport implements ModelDriven<User>{
//模型驱动要使用的对象
private User user=new User();
public User getModel(){
return user;
}
//注入UserService
private UserService userService;
public void setUserService(UserService userService) {
this.userService = userService;
}
/*
* 跳转到注册页面的执行方法
*
*/
public String registPage(){
return "registPage";
}
/**
* AJAX进行异步校验用户名的执行方法
* @throws IOException
*/
public String findByName() throws IOException{
//调用Service进行查询
User existUser = userService.findByUsername(user.getUsername());
//获得response对象,项页面输出
HttpServletResponse response=ServletActionContext.getResponse();
response.setContentType("text/html;charset=UTF-8");
//判断
if (existUser!=null){
//查询到该用户:用户名已经存在
response.getWriter().println("<font color='red'>用户名已经存在</font>");
}else{
//没有查询到该用户:用户名可以使用
response.getWriter().println("<font color='greem'>用户名可以使用</font>");
}
return NONE;
}
}
编写实体类
User
package cn.itcast.shop.user.vo;
/*
* 用户模块实体类:
* @author
* CREATE TABLE `user` (
`uid` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(255) DEFAULT NULL,
`password` varchar(255) DEFAULT NULL,
`name` varchar(255) DEFAULT NULL,
`email` varchar(255) DEFAULT NULL,
`phone` varchar(255) DEFAULT NULL,
`addr` varchar(255) DEFAULT NULL,
`state` int(11) DEFAULT NULL,
`code` varchar(64) DEFAULT NULL,
PRIMARY KEY (`uid`)
) ENGINE=InnoDB AUTO_INCREMENT=9 DEFAULT CHARSET=utf8;
* */
public class User {
private Integer uid; //用户id
private String username;//用户名
private String password;//用户密码
private String name;//用户姓名
private String email;//用户Email
private String phone;//用户电话
private String addr; //用户地址
private Integer state;//用户状态:激活
private String code;//
//自动生成get,set, Source--Generate Getters and Setters
public Integer getUid() {
return uid;
}
public void setUid(Integer uid) {
this.uid = uid;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
public String getPhone() {
return phone;
}
public void setPhone(String phone) {
this.phone = phone;
}
public String getAddr() {
return addr;
}
public void setAddr(String addr) {
this.addr = addr;
}
public Integer getState() {
return state;
}
public void setState(Integer state) {
this.state = state;
}
public String getCode() {
return code;
}
public void setCode(String code) {
this.code = code;
}
}
User.hbm.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE hibernate-mapping PUBLIC
"-//Hibernate/Hibernate Mapping DTD 3.0//EN"
"http://www.hibernate.org/dtd/hibernate-mapping-3.0.dtd">
<hibernate-mapping>
<class name ="cn.itcast.shop.user.vo.User" table="user">
<id name="uid">
<generator class="native"></generator>
</id>
<property name="username"></property>
<property name="password"></property>
<property name="name"></property>
<property name="email"></property>
<property name="phone"></property>
<property name="addr"></property>
<property name="state"></property>
<property name="code"></property>
</class>
</hibernate-mapping>
配置到Spring中
4.编写DAO
继承HibernateDaoSupport
package cn.itcast.shop.user.dao;
import java.util.List;
import org.springframework.orm.hibernate3.support.HibernateDaoSupport;
import cn.itcast.shop.user.vo.User;
/*
* 用户模块持久层代码
* @author
* */
public class UserDao extends HibernateDaoSupport{
//按照名称查询是否有该用户:
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;
}
}
配置文件中注入sessionFactory
5.编写Service
注入UserDao
事务管理
<!-- 事务管理: -->
<!-- 事务管理器 -->
<bean id="transactionManager" class="org.springframework.orm.hibernate3.HibernateTransactionManager">
<property name="sessionFactory" ref="sessionFactory"/>
</bean>
<!-- 开启注解事务 -->
<tx:annotation-driven transaction-manager="transactionManager" />
<!--================================== Action配置============================================================ -->
<!-- 首页访问的Action -->
<bean id="indexAction" class="cn.itcast.shop.index.action.IndexAction" scope="prototype">
</bean>
<!-- 用户模块的Action -->
<bean id ="userAction" class="cn.itcast.shop.user.action.UserAction" scope="prototype">
<!-- 注入Service -->
<property name="userService" ref="userService"></property>
</bean>
<!--================================== Service配置============================================================ -->
<bean id="userService" class="cn.itcast.shop.user.service.UserService">
<property name="userDao" ref="userDao"></property>
</bean>
<!-- =================================Dao配置 ===================================================== -->
<bean id="userDao" class="cn.itcast.shop.user.dao.UserDao">
<property name="sessionFactory" ref="sessionFactory"/>
</bean>