JavaWeb网上图书商城完整项目--day02-10.提交注册表单功能之页面实现
1、当从服务器返回的注册错误信息的时候,我们在注册界面需要将错误信息显示出来
我们需要修改regist.jsp页面的代码:其中error是一个haspmap,c标签对map的属性可以直接使用
${errors.loginname}这种形式
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>注册</title>
<link rel="stylesheet" type="text/css" href="<c:url value='/jsps/css/user/regist.css'/>">
<script type="text/javascript" src="<c:url value='/jquery/jquery-1.5.1.js'/>"></script>
<script type="text/javascript" src="<c:url value='/jsps/js/user/regist.js'/>"></script>
</head>
<body>
<div id="divMain">
<div id="divTitle"><span id="spanTitle">新用户注册</span></div>
<div id="divBoby">
<form action="/goods/UserServlet" method="post" id="registForm">
<input type="hidden" name="method" value="regist"/>
<table id="tableForm">
<tr>
<td class="tdText">用户名:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="loginname" id="loginname"/></td>
<td class="tdError"><label class="errorClass" id="loginnameError">${errors.loginname}</label></td>
</tr> <tr>
<td class="tdText">登陆密码:</td>
<td class="tdInput"><input class="inputClass" type="password" name ="loginpass" id="loginpass"/></td>
<td class="tdError"><label class="errorClass" id="loginpassError">${errors.loginpass }</label></td>
</tr> <tr>
<td class="tdText">确认密码:</td>
<td class="tdInput"><input class="inputClass" type="password" name ="reloginrepass" id="reloginrepass"/></td>
<td class="tdError"><label class="errorClass" id="reloginrepassError">${errors.reloginpass }</label></td>
</tr> <tr>
<td class="tdText">Email:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="email" id="email"/></td>
<td class="tdError"><label class="errorClass" id="emailError">${errors.email }</label></td>
</tr> <tr>
<td class="tdText">图形验证码:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="verifyCode" id="verifyCode"/></td>
<td class="tdError"><label class="errorClass" id="verifyCodeError">${errors.verifyCode }</label></td>
</tr> <tr>
<td class="tdText"></td>
<td class="tdInput"><div id="divVerifyCode"><img id="imgVerifyCode" src="<c:url value='/VerifyCodeServlet'/>"></div></td>
<td class="tdError"><label ><a href="javascript:changeVerifyCode()">换一张</a></label></td>
</tr> <tr>
<td class="tdText"></td>
<td class="tdInput"><input type="image" src="<c:url value='/images/regist1.jpg'/>" id="submitBtn"/></td>
<td class="tdError"><label></label></td>
</tr> </table>
</form>
</div>
</div>
</body>
</html>
我们应该实现下面的功能:
当用户输错信息之后,在regist.jsp现在错误信息的同时,已经显示用户以前填写的信息,如何实现了,用户提交了参数,我们已经将参数保存到servlet中,当servlet检测用户参数失败的时候,servlet除了保存错误信息之外,还应该保存用户的信息,然后跳转到regsit.jsp界面,除了显示错误信息之外,还显示用户以前填写的信息,
所以servlet应该增加保存用户信息的功能。
package com.weiyuan.goods.user.web.servlet; import java.io.IOException;
import java.util.Map; import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import org.apache.commons.collections.map.HashedMap; import com.weiyuan.goods.user.domian.User;
import com.weiyuan.goods.user.service.UserService; import cn.itcast.commons.CommonUtils;
import cn.itcast.servlet.BaseServlet; /**
* Servlet implementation class UserServlet
*/
@WebServlet("/UserServlet")
public class UserServlet extends BaseServlet{
private static final long serialVersionUID = 1L;
private UserService service = new UserService();
/*
* 用户注册页面使用ajax校验/*
* 用户注册页面使用ajax校验用户名会调用该方法
* *会调用该方法
* */
public String validateLoginname(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//首先获得用户上传的用户名
String loginName = request.getParameter("loginname");
boolean flag = service.ajaxValidateLoginName(loginName);
response.getWriter().print(flag);
return null;
}
/*
* 用户注册页面使用ajax校验邮箱会调用该方法
* */
public String validateEmail(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//获得用户上传的emai String email = request.getParameter("email");
System.out.println("validateEmail is called"+email);
boolean flag = service.ajaxValidateEmail(email);
response.getWriter().print(flag);
return null;
} /*
* 用户注册页面使用ajax校验验证码会调用该方法
* */
public String validateVerifyCode(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//获得用户上传的verfycode
String verifyCode = request.getParameter("verifyCode");
//获得session中保存的验证码
String sessionCode = (String) request.getSession().getAttribute("vCode");
//二者进行比较看是否相等
System.out.println("validateVerifyCode is called"+verifyCode+":"+sessionCode);
boolean flag = sessionCode.equalsIgnoreCase(verifyCode);
response.getWriter().print(flag);
return null;
} /*
* 当用户从邮箱点击的激活的时候会调用该方法,并且把激活码传递过来
*
* */
public String activation(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
System.out.println("activation is called"); return null;
} /*
* 当用户注册的时候会调用该方法
*
* */
public String regist(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
System.out.println("activation is called"); //1、将请求的参数封装成User对象
User user = CommonUtils.toBean(request.getParameterMap(), User.class);
//2 、对传递过来的参数进行校验,把错误的信息封装到一个hashMap中
Map errors = validateParams(user, request);
if(errors.size() > 0){//说明参数错误,跳转到注册界面提示用户输入的参数有误
request.setAttribute("errors", errors);
request.setAttribute("user", user);
return "f:/jsps/user/regist.jsp";
}
service.addUser(user);
request.setAttribute("code", "success");
request.setAttribute("msg", "用户注册成功,请马上到邮箱进行激活");
return "f:/jsps/msg.jsp"; } public Map validateParams(User user,HttpServletRequest request){
Map<String, String> map = new HashedMap();
//校验用户名
String loginName = user.getLoginname();
if(loginName == null || loginName.isEmpty()){
map.put("loginname", "用户名不能为空");
}
if(loginName.length() < 3 || loginName.length() > 20){
map.put("loginname", "用户名长度应该在3到20之间");
}
//校验用户名是否注册
if(service.ajaxValidateLoginName(loginName)){
map.put("loginname", "用户名已经被注册");
} //检查登陆密码
String loginpass = user.getLoginpass();
if(loginpass == null || loginpass.isEmpty()){
map.put("loginpass", "登陆密码不能为空");
}
if(loginpass.length() < 3 || loginpass.length() > 20){
map.put("loginname", "登陆密码的长度应该在3到20之间");
} //检查确认密码的信息
//检查登陆密码
String reloginpass = user.getReloginpass();
if(reloginpass == null || reloginpass.isEmpty()){
map.put("reloginpass", "登陆密码不能为空");
}
if(reloginpass.length() < 3 || reloginpass.length() > 20){
map.put("reloginpass", "登陆密码的长度应该在3到20之间");
}
if(!reloginpass.equalsIgnoreCase(loginpass)){
map.put("reloginpass", "两次输入的密码不一样");
} //检查邮箱
String email = user.getEmail();
if(email == null || email.isEmpty()){
map.put("email", "登陆邮箱不能为空");
}
//检查邮箱的格式是否正确
if(!email.matches("^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\\.[a-zA-Z0-9_-]{2,3}){1,2})$")){
map.put("email", "邮箱格式不正确");
} //检查验证码是否相等
String verifyCode = user.getVerifyCode();
//获得session中保存的验证码
String sessionCode =(String) request.getSession().getAttribute("vCode");
if(!verifyCode.equalsIgnoreCase(sessionCode)){
map.put("verifyCode", "验证码不正确");
} return map; } }
在jsp增加用户显示以前记录的信息
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>注册</title>
<link rel="stylesheet" type="text/css" href="<c:url value='/jsps/css/user/regist.css'/>">
<script type="text/javascript" src="<c:url value='/jquery/jquery-1.5.1.js'/>"></script>
<script type="text/javascript" src="<c:url value='/jsps/js/user/regist.js'/>"></script>
</head>
<body>
<div id="divMain">
<div id="divTitle"><span id="spanTitle">新用户注册</span></div>
<div id="divBoby">
<form action="/goods/UserServlet" method="post" id="registForm">
<input type="hidden" name="method" value="regist"/>
<table id="tableForm">
<tr>
<td class="tdText">用户名:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="loginname" id="loginname" value="${user.loginname}"/></td>
<td class="tdError"><label class="errorClass" id="loginnameError">${errors.loginname}</label></td>
</tr> <tr>
<td class="tdText">登陆密码:</td>
<td class="tdInput"><input class="inputClass" type="password" name ="loginpass" id="loginpass" value="${user.loginpass}"/></td>
<td class="tdError"><label class="errorClass" id="loginpassError">${errors.loginpass }</label></td>
</tr> <tr>
<td class="tdText">确认密码:</td>
<td class="tdInput"><input class="inputClass" type="password" name ="reloginpass" id="reloginrepass" value="${user.reloginpass}"/></td>
<td class="tdError"><label class="errorClass" id="reloginrepassError">${errors.reloginpass }</label></td>
</tr> <tr>
<td class="tdText">Email:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="email" id="email" value="${user.email}" /></td>
<td class="tdError"><label class="errorClass" id="emailError">${errors.email }</label></td>
</tr> <tr>
<td class="tdText">图形验证码:</td>
<td class="tdInput"><input class="inputClass" type="text" name ="verifyCode" id="verifyCode"/></td>
<td class="tdError"><label class="errorClass" id="verifyCodeError">${errors.verifyCode }</label></td>
</tr> <tr>
<td class="tdText"></td>
<td class="tdInput"><div id="divVerifyCode"><img id="imgVerifyCode" src="<c:url value='/VerifyCodeServlet'/>"></div></td>
<td class="tdError"><label ><a href="javascript:changeVerifyCode()">换一张</a></label></td>
</tr> <tr>
<td class="tdText"></td>
<td class="tdInput"><input type="image" src="<c:url value='/images/regist1.jpg'/>" id="submitBtn"/></td>
<td class="tdError"><label></label></td>
</tr> </table>
</form>
</div>
</div>
</body>
</html>
我们来看程序运行的效果:

JavaWeb网上图书商城完整项目--day02-10.提交注册表单功能之页面实现的更多相关文章
- JavaWeb网上图书商城完整项目--day02-28.查询所有分类功能之left页面使用Q6MenuBar组件显示手风琴式下拉菜单
首先页面去加载的时候,会去加载main.js文件,我们在加载left.jsp.top.jsp body.jsp,现在我们修改main.jsp的代码,让它去请求的时候去访问的是不在直接去访问left.j ...
- JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验
1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...
- JavaWeb网上图书商城完整项目--24.注册页面的css样式实现
现在框架已经做好了,即下来我们要对页面进行装饰了,第一步给每一个元素添加id 1.最外面的div添加id为divMain 2.第二个div添加id为divTitle,里面的span对应的id为span ...
- JavaWeb网上图书商城完整项目--过滤器解决中文乱码
我们知道,如果是POST请求,我们需要调用request.setCharacterEncoding(“utf-8”)方法来设计编码:如果是GET请求,我们需要自己手动来处理编码问题.如果我们使用了En ...
- JavaWeb网上图书商城完整项目--day03-1.图书模块功能介绍及相关类创建
1 前两天我们学习了user用户模块和图书的分类模块,接下来我们学习图书模块 图书模块的功能主要是下面的功能: 2 接下来我们创建对应的包 我们来看看对应的数据库表t_book CREATE TABL ...
- JavaWeb网上图书商城完整项目--day02-3.regist页面输入框失去焦点进行校验
当输入框输入数据之后,当输入框失去焦点的时候,我们需要对输入的数据进行校验 l 用户名校验: 用户名不能为空: 用户名长度必须在3 ~ 20之间: 用户名已被注册(需要异步访问服务器). l 登录 ...
- JavaWeb网上图书商城完整项目--13.项目所需环境的搭建
1.首先安装mysql 创建项目所需的数据库,直接运行项目提供的goods.sql文库 2.myeclipse创建一个web project ,项目的名称是goods 把视频中提供的项目原型下的提供的 ...
- JavaWeb网上图书商城完整项目--12.项目所需jquery函数介绍之ajax
jquery中使用ajax发送异步请求 下面的一个案例在input输入框失去焦点的时候发送一个异步的请求: 我们来看程序的案例: 这里要强调的是返回值最好选择是json,json对应的就是对象,Jav ...
- JavaWeb网上图书商城完整项目--11.项目所需jquery函数介绍
1.下载jquery的函数包 2.强函数包添加到工程的web-root目录下 3.在jsp文件中加载js文件 <script type="text/javascript" s ...
- JavaWeb网上图书商城完整项目--BaseServlet
1.以前进行操作的时候,例如我们进行登陆操作我们使用LoginServlet进行处理,进行注册操作我们使用RegisterServlet,很多业务的操作的时候我们就要定义很多个Servlet 有了Ba ...
随机推荐
- PowerPC-object与elf中的符号引用
https://mp.weixin.qq.com/s/6snzjEpDT4uQuCI2Nx9VcQ 一. 符号引用 编译会先把每个源代码文件编译成object目标文件,然后把所有目标文件链接到一起 ...
- Java 第十一届 蓝桥杯 省模拟赛 第十层的二叉树
一棵10层的二叉树,最多包含多少个结点? 注意当一棵二叉树只有一个结点时为一层. 答案提交 这是一道结果填空的题,你只需要算出结果后提交即可.本题的结果为一个整数,在提交答案时只填写这个整数,填写多余 ...
- Java 第十一届 蓝桥杯 省模拟赛 19000互质的个数
问题描述 不超过19000的正整数中,与19000互质的数的个数是多少? 答案提交 这是一道结果填空的题,你只需要算出结果后提交即可.本题的结果为一个整数,在提交答案时只填写这个整数,填写多余的内容将 ...
- Java实现 蓝桥杯VIP 算法训练 王后传说
问题描述 地球人都知道,在国际象棋中,后如同太阳,光芒四射,威风八面,它能控制横.坚.斜线位置. 看过清宫戏的中国人都知道,后宫乃步步惊心的险恶之地.各皇后都有自己的势力范围,但也总能找到相安无事的办 ...
- 第八届蓝桥杯JavaA组省赛真题
解题代码部分来自网友,如果有不对的地方,欢迎各位大佬评论 题目1.迷宫 题目描述 X星球的一处迷宫游乐场建在某个小山坡上. 它是由10x10相互连通的小房间组成的. 房间的地板上写着一个很大的字母. ...
- java实现 蓝桥杯 算法提高 Problem S4: Interesting Numbers 加强版
1 问题描述 Problem Description We call a number interesting, if and only if: 1. Its digits consists of o ...
- 看Python如何无缝转换Word和Excel
word和excel是办公过程必不可少的两个文档类型,word多用于文字处理,比如备忘录.论文.书籍.报告.商业信函等,excel可以制作精美的图表,还可以计算.分析.记录数据.二者在功能达成上有重叠 ...
- 循序渐进VUE+Element 前端应用开发(7)--- 介绍一些常规的JS处理函数
在我们使用VUE+Element 处理界面的时候,往往碰到需要利用JS集合处理的各种方法,如Filter.Map.reduce等方法,也可以设计到一些对象属性赋值等常规的处理或者递归的处理方法,以前对 ...
- jsp页面用DBHelper实现简单的登陆验证
首先我们需要写一个简单的登陆页面login.jsp,然后用from表单提交给index.jsp页面.在index.jsp页面通过DBHelper连接数据库判断账号和密码,如果密码正确则显示登陆成功. ...
- 查看Android系统中硬件信息的文件
文件目录: 使用Linux命令,进入到/proc目录 进入/proc目录,可以查看内存信息(memoinfo)或CPU信息(cpuinfo),使用cat命令