【ajax】ajax异步实现用户注册验证
从前台到后台实现简单用户注册检查用户是否存在
1.编写domain
public class User {
private String username;
private String password;
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;
}
}
2.编写dao
public class UserDao {
/**
* 通过用户名获取用户
* @param username
* @return
* @throws SQLException
*/
public User getUserByUsername4Ajax(String username) throws SQLException {
QueryRunner qr = new QueryRunner(DataSourceUtils.getDataSource());
String sql = "select * from user where username = ? limit 1";
User user = qr.query(sql, new BeanHandler<>(User.class), username);
return user;
}
}
3.编写service
public class UserService {
/**
* 检测用户名是否被占用
* @param username
* @return
* @throws SQLException
*/
public User checkUsername4Ajax(String username) throws SQLException{
UserDao userDao = new UserDao();
return userDao.getUserByUsername4Ajax(username);
}
}
4.编写controller
public class CheckUsername4AjaxServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 0.设置编码
// 1.接收用户名
String username = request.getParameter("username");
username = new String(username.getBytes("iso-8859-1"),"utf-8");
System.out.println(username);
// 2.调用service 完成查询 返回值user
UserService userService = new UserService();
User user = null;
try {
user = userService.checkUsername4Ajax(username);
} catch (SQLException e) {
e.printStackTrace();
}
// 3.写回信息
if (user == null) {
response.getWriter().println("1");
} else {
response.getWriter().println("0");
}
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
5.编写注册页面
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>用户注册</title>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(function() {
// 给username派发一个失去焦点事件发送ajax请求
$("input[name='username']").blur(function() {
// 获取输入的文本内容
var $value = $(this).val();
var url = "${pageContext.request.contextPath}/checkUsername4Ajax";
var params = "username="+$value;
$.get(url, params, function(d) {
if (d == 1) {
$("#username_msg").html("<font color='green'>用户名可以使用</font>");
} else {
$("#username_msg").html("<font color='red'>用户名已被占用</font>");
}
});
});
});
</script>
</head>
<body>
<form action="" method="post" >
<table border="0" align="center" cellpadding="0">
<tr >
<td colspan="2" align="center"><h2>用户注册</h2></td>
</tr>
<tr>
<td>用户名：</td>
<td><input type="text" name="username"/></td>
<td><span id="username_msg"></span></td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password" name="password"/></td>
<td></td>
</tr>
<tr>
<td colspan="3" align="center"><input type="submit" name="submit" id="submit" value="提交"/><input type="reset" name="reset" value="重置"/></td>
</tr>
</table>
</form>
</body>
</html>
附录
1.DataSourceUtils工具类
public class DataSourceUtils {
private static ComboPooledDataSource ds = new ComboPooledDataSource();
private static ThreadLocal<Connection> tl = new ThreadLocal<>();
/**
* 获取数据源
* @return 连接池
*/
public static DataSource getDataSource() {
return ds;
}
/**
* 从当前线程上获取连接
* @return 连接
* @throws SQLException
*/
public static Connection getConnection() throws SQLException {
Connection conn = tl.get();
if (conn == null) {
// 第一次获取，创建一个连接和当前的线程绑定
conn = ds.getConnection();
// 绑定
tl.set(conn);
}
return conn;
}
/**
* 释放资源
* @param conn 连接
* @param st 语句执行者
* @param rs 结果集
*/
public static void closeResource(Connection conn, Statement st, ResultSet rs) {
closeResource(st, rs);
closeConn(conn);
}
/**
* 释放连接
* @param conn 连接
*/
private static void closeConn(Connection conn) {
if (conn != null) {
try {
conn.close();
// 和当前的线程解绑
tl.remove();
} catch (SQLException e) {
e.printStackTrace();
}
conn = null;
}
}
private static void closeResource(Statement st, ResultSet rs) {
closeResultSet(rs);
closeStatement(st);
}
private static void closeStatement(Statement st) {
if (st != null) {
try {
st.close();
} catch (SQLException e) {
e.printStackTrace();
}
st = null;
}
}
private static void closeResultSet(ResultSet rs) {
if (rs != null) {
try {
rs.close();
} catch (SQLException e) {
e.printStackTrace();
}
rs = null;
}
}
/**
* 开启事务
* @throws SQLException
*/
public static void startTransaction() throws SQLException{
// 获取连接
// 开始事务
getConnection().setAutoCommit(false);
}
/**
* 事务提交
*/
public static void commitAndClose() {
try {
// 获取连接
Connection conn = getConnection();
// 提交事务
conn.commit();
// 释放资源
conn.close();
// 解除绑定
tl.remove();
} catch (SQLException e) {
e.printStackTrace();
}
}
public static void rollbackAndClose() {
try {
// 获取连接
Connection conn = getConnection();
// 事务回滚
conn.rollback();
// 释放资源
conn.close();
// 解除绑定
tl.remove();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
2.c3p0-config配置文件
<c3p0-config>
<!-- 默认配置，如果没有指定则使用这个配置 -->
<default-config>
<!-- 基本配置 -->
<property name="driverClass">com.mysql.jdbc.Driver</property>
<property name="jdbcUrl">jdbc:mysql://localhost:3306/ajax</property>
<property name="user">root</property>
<property name="password">123456</property>
<!--扩展配置-->
<property name="checkoutTimeout">30000</property>
<property name="idleConnectionTestPeriod">30</property>
<property name="initialPoolSize">10</property>
<property name="maxIdleTime">30</property>
<property name="maxPoolSize">100</property>
<property name="minPoolSize">10</property>
<property name="maxStatements">200</property>
</default-config>
</c3p0-config>
【ajax】ajax异步实现用户注册验证的更多相关文章
- ajax jquery 异步表单验证
文件目录: html代码: <html> <head> <title>异步表单验证</title> <script type='text/java ...
- PHP+Ajax 异步通讯注册验证
HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
- struts2+ajax实现异步验证实现
由于老师布置作业的需要,在添加管理员的时候,要实现验证添加的管理员的用户名是否在数据库中已经存在,然后再客户端给用户一个提示.我首先想到的就是利用ajax实现异步验证技术,由于利用的ssh框架,所以在 ...
- struts2+ajax实现异步验证
由于老师布置作业的需要,在添加管理员的时候,要实现验证添加的管理员的用户名是否在数据库中已经存在,然后再客户端给用户一个提示.我首先想到的就是利用ajax实现异步验证技术,由于利用的ssh框架,所以在 ...
- 表单验证--通过原生js模仿ajax的异步交互
今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...
- thinkphp+jquery+ajax前后端交互注册验证
thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- jQuery结合Ajax实现简单的前端验证和服务端查询
上篇文章写了简单的前端验证由传统的JavaScript转向流畅的jQuery滑动验证,现在拓展一下,使用Ajax实现用户体验比较好的异步查询,同样还是从建立一个简单的表单开始 <form nam ...
- 掌握 Ajax，第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求
转http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro2/ 掌握 Ajax,第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求 ...
- ajax初探--实现简单实时验证
学习技术最好的方式就是在做中学,做一个小demo来对前端输入进行实时验证. 利用ajax技术和Sevlet技术来实现,使用原生的js. 源码可访问,我的Github 什么是ajax Ajax 即&qu ...
随机推荐
- java原生文件打包
一.背景 前端时间,自己做的项目需要打包功能,不想再引外部的jar包 便用java.util.zip做了下该功能 二.适用场景 生成多个word.excel.xml等文件,并要求打包下载的情形 例:项 ...
- Hadoop ->> 关于数据分割（Data Split）的思考
今天开始学习Hadoop这门热门的数据库技术.直接从被奉为Hadoop圣经的<Hadoop The Definitive Guide 4th Edition>入手.第一章作者写到一个关于分 ...
- 两种计算Java对象大小的方法
之前想研究一下unsafe类,碰巧在网上看到了这篇文章,觉得写得很好,就转载过来.原文出处是: http://blog.csdn.net/iter_zc/article/details/4182271 ...
- jQuery Mobile 移动 web 应用程序框架
在这里我们主要讲一下如何引用jQuery Mobile(引用了jQuery Mobile,你就能引用jQuery Mobile里已经封装好的代码,让开发更加快捷简单) 从 CDN 引用 jQuery ...
- Struts的学习-eclipse与idea与struts的连接
1.建立一个空白工程(里面是没有文件的). 可以在文件放置找到项目文件夹 2.点击托管项目到码云 (ps:没有码云帐号的自己注册) 3.按快捷键:ctrl+alt+shift+s 呼出项目结构管理器, ...
- Win+Tab键实现自定义程序列表间的窗口切换
程序是用AutoHotkey语言写的, 说明: 以自己使用频率的顺序在ExeList自定义的程序间切换 切换可以以所有窗口切换,也可以按程序组切换(比如在word窗口间切换) 程序组可以分别定义排除的 ...
- asp.net反射的运用
反射的用途: (1)使用Assembly定义和加载程序集,加载在程序集清单中列出模块,以及从此程序集中查找类型并创建该类型的实例. (2)使用Module了解包含模块的程序集以及模块中的 ...
- codeforces 611D New Year and Ancient Prophecy
f[i = 以i结尾][j = 长度为j] = 方案数. f[i][j] = sum{ f[i-j][k] , k < j || (k == j && s(i-j+1,j) &g ...
- Django：视图
Django的View(视图) 一,一个简单的视图 下面是一个以HTML文档的形式返回当前日期和时间的视图: from django.http import HttpResponse import d ...
- webstorn中的vue文件识别es6代码
webstorn中的vue文件识别es6代码 1.webstorm中es6语法报错,解决方法: 打开 Settings => Languages & Frameworks => J ...