1. userReg.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
<title>用户添加页面</title>
<script type="text/javascript" src="${path}/common/plugins/datepicker/WdatePicker.js"></script>
<script type="text/javascript" src="${path}/dwr/interface/place.js"></script>
<script type="text/javascript" src="${path}/dwr/engine.js"></script>
<script type="text/javascript" src="${path}/dwr/util.js"></script>
<script>
function getCity(){
var obj_pro=document.getElementById("province");
var obj_City = document.getElementById("city");
var pro_index=obj_pro.selectedIndex;
var pro_value=obj_pro.options[pro_index].value;
if(pro_value!=""&&pro_value!=null){
place.getCityList(pro_value,cityReturn);
}else{
DWRUtil.removeAllOptions(obj_City);
DWRUtil.addOptions(obj_City,{'':'请选择城市...'});
}
}
function cityReturn(data){
var obj_City = document.getElementById("city");
DWRUtil.removeAllOptions(obj_City);
DWRUtil.addOptions(obj_City,{'':'请选择城市...'});
DWRUtil.addOptions(obj_City,data);
}
function currentDate(){
var myDate=new Date();
var year=myDate.getFullYear();
var month=myDate.getMonth()+1;
var day=myDate.getDate();
var now=year+"-"+month+"-"+day;
document.forms[0]['user.startDate'].value=now;
}
// 创建XMLHTTPRequest对象
function getXMLHTTPRequest(){
var xmlHttp;
if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest(); //非IE浏览器,用xmlhttprequest对象创建
}else if(window.ActiveXObject){
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); //IE浏览器用activexobject对象创建
}
return xmlHttp;
}
var http;
function checkUser(){
var username=document.forms[0]['user.username'].value;
http=getXMLHTTPRequest();
var url="${path}/user/checkUser.action?user.username="+username;
if(http){ //成功创建XMLHTTPRequest对象
http.open("GET",url,true); //与服务端建立连接(请求方式post或get,地址,true表示异步)
http.onreadystatechange=callback; //指定回调函数
http.send(null); //发送请求
}
}
function callback(){
if(http.readyState==4){
if(http.status==200){
processResponse();
}
}
}
//处理服务器端响应
function processResponse(){
var text=http.responseText;
if(text=="true"){
document.getElementById("error").innerHTML="用户名已经存在";
}else{
document.getElementById("error").innerHTML="";
}
}
</script>
</head>
<body>
<form name="form" method="post" action="${path }/user/userSave.action">
<table align="center" class="table-form" >
<tr>
<td colspan="4" class="table-title">添加用户信息</td>
</tr>
<tr>
<td class=table-lable_title>用户名</td>
<td><input type="text" name="user.username" onBlur="checkUser()"><span id="error" style="color:red"></span></td>
<td class=table-lable_title>密 码</td>
<td><input type="password" name="user.password" id="password" size="21"></td>
</tr>
<tr>
<td class=table-lable_title>性 别</td>
<td><select name="user.sex" style="width:50px">
<option value="1"> 男 </option>
<option value="0"> 女 </option>
</select>
</td>
<td class=table-lable_title>省 份</td>
<td><select name="user.provinceId" id="province" onChange="getCity();">
<option value="">请选择省份</option>
<s:iterator value="provinceList">
<option value="<s:property value="id"/>"><s:property value="provinceName"/></option>
</s:iterator>
</select>
</td>
</tr>
<tr>
<td class=table-lable_title>城 市</td>
<td><select name="user.cityId" id="city">
<option value="">请选择城市...</option>
</select>
</td>
<td class=table-lable_title>电 话</td>
<td><input type="text" name="user.telphone" id="telphone" size="20"></td>
</tr>
<tr>
<td class=table-lable_title>E-Mail</td>
<td><input type="text" name="user.email" id="email" size="20"></td>
<td class=table-lable_title>添加日期</td>
<td>
<input type="text" name="user.startDate" class="Wdate" value="" onmouseover="currentDate();" onclick="new WdatePicker(this)" readonly>
</td>
</tr>
<tr>
<td colspan="4" class="table-button">
<input type="submit" value="提交" >
<input type="reset" value="重置" >
</td>
</tr>
</table>
</form>
</body>
</html>
2. UserAction.java
public class UserAction{
private UserService userService;
public void setUserService(UserService userService){
this.userService=userService;
}
public void checkUser(){
HttpServletResponse response=ServletActionContext.getResponse();
boolean flag=userService.isExistUser(user.getUsername());
try{
PrintWriter pw=response.getWriter();
pw.print(flag);
pw.close();
}catch(IOException e){
}
}
}
分享到:
相关推荐
在这个"Ajax注册验证用户名实例"中,我们将深入探讨如何利用Ajax技术来实现用户在注册时实时验证用户名是否已存在,从而提供更优秀的用户体验。 首先,我们需要一个HTML页面作为用户界面,包含一个输入框让用户输入...
以下将详细讲解如何使用AJAX实现异步验证用户名是否重复。 一、理解AJAX AJAX 是一种在不重新加载整个网页的情况下,能够更新部分网页的技术。它通过创建XMLHttpRequest对象(通常称为XHR),向服务器发送请求并...
SSH整合AJAX验证用户名存在的完整实例是一个典型的Web开发应用场景,主要涉及了Struts2(S)、Spring(S)和Hibernate(H)三大框架的集成,以及异步JavaScript和XML(AJAX)技术的运用,用于提升用户体验。...
"利用Ajax实现无刷新验证用户名和密码是否正确"这一技术就是为了让用户在输入登录信息时能够得到即时反馈,无需等待页面整体刷新,极大地提升了交互体验。Ajax(Asynchronous JavaScript and XML)是一种创建动态...
在本场景中,标题"Ajax请求验证用户名问题"指的是使用Ajax来实现用户输入用户名时实时检查该用户名是否已被占用的功能。这通常在注册或登录界面非常常见,提供用户友好的体验,因为他们可以即时得知用户名是否可用,...
总结起来,这个实例展示了如何使用Ajax、PHP、MySQL和Apache协同工作,实现一个高效、安全的用户名异步验证功能。Ajax提供了无刷新的交互体验,PHP处理服务器端逻辑,MySQL管理数据存储,而Apache则作为可靠的服务器...
总结来说,"AJax验证用户名是否存在"是Web开发中常见的功能,通过DWR或原生JavaScript,我们可以实现与后台的无刷新交互,检查用户名的可用性,提高用户注册或登录的效率。同时,需要注意安全性与性能的优化,确保...
【描述】虽然描述为空,但可以推断这篇博文可能详细讲解了如何通过AJAX技术实现在用户输入用户名时,后台验证用户名是否已存在或符合特定规则,避免用户提交表单后才发现问题,提高用户体验。 【标签】"源码 工具...
在现代Web应用中,用户体验的重要性...总的来说,"Ajax验证用户名是否存在"是一个典型的前后端交互示例,展示了如何使用Ajax提升用户体验。它结合了前端的动态交互和后端的数据验证,是Web开发中不可或缺的一部分。
本文将通过实例展示如何利用layui前端框架结合ajax技术实现表单验证中用户名的唯一性检查。 ### 了解layui表单验证 layui是一款前端UI框架,提供了一套简单的表单验证机制。通过给输入框添加特定的lay-verify属性...
在本教程中,我们将探讨如何利用AJAX(Asynchronous JavaScript and XML)技术来检测用户名是否重复,以提升用户体验,避免用户在提交表单后才收到用户名已存在的错误提示。 首先,让我们理解什么是AJAX。AJAX是一...
总之,"AJAX验证用户名的实例"是一个实用的入门项目,它涵盖了AJAX的基础知识,包括请求的发送、数据的接收和UI的更新。对于想要学习AJAX的初学者,这是一个很好的起点,可以帮助他们逐步掌握这种强大的Web开发技术...
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互...通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某
SSH整合AJAX验证用户名存在和验证码的完整实例SSH整合AJAX验证用户名存在和验证码的完整实例SSH整合AJAX验证用户名存在和验证码的完整实例SSH整合AJAX验证用户名存在和验证码的完整实例SSH整合AJAX验证用户名存在和...
本篇将详细介绍如何使用jQuery库来实现一个简单的Ajax验证用户名是否可用的实例。 首先,我们需要在HTML页面中设置输入框和显示验证结果的元素: ```html <span id="username_span"></span> ``` 这里的`<input>`...
### AJAX与Struts结合实现无刷新验证用户名是否存在 在Web开发中,用户体验是至关重要的因素之一。传统的表单提交方式往往会导致整个页面重新加载,这不仅降低了用户体验,还增加了服务器的负担。为了解决这一问题...
"AJAX无刷新验证用户名是否存在"是一个典型的应用场景,它允许用户在输入用户名时实时检查该用户名是否已被占用,而无需提交整个表单或刷新整个页面。这一功能对于注册、登录等涉及用户账号的页面尤为重要,可以防止...
在这个“Ajax实现简单的用户名验证”的示例中,我们将探讨如何利用Ajax来检查用户在注册时输入的用户名是否已存在,从而提供即时的反馈,提升用户体验。 首先,我们需要理解Ajax的基本组成部分: 1. **...
这个实例用运用了ajax技术与jquery技术,实例实现了网站用户名的检测。这与传统的同步方式检测用户名是否存在,全然不同,本例实现了ajax的异步请求,用户无须等待,页面在返回结果时无刷新,大大改善了用户的体验!...