在上一篇 《JSP与数据库的增删改查》的基础上修改以下部分,区域部分不需要改动
其界面跳转的过程图如下
index.jsp
<%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<html>
<head>
<title></title>
</head>
<%
UserInfoDao dao=new UserInfoDao();
ArrayList list=dao.findAll();
%>
<script type="text/javascript">
function myAction(pid,type){
document.forms[0].id.value=pid;
document.forms[0].actionType.value=type;
document.forms[0].submit();
}
</script>
<body>
<h1 align="center"><br></h1><h1 align="center"> 用户信息</h1>
<form action="control.jsp" method="post">
<!-- 用于存放选择的id,然后会随表单提交给服务器处理页面 -->
<input type="hidden" name="id">
<!-- 用于存放当前的操作标识,届时会由control.jsp根据这标识将操作分发给具体的业务页面处理 -->
<input type="hidden" name="actionType"/>
<table align="center" border="1" width="80%">
<tr>
<td colspan="8" align="right">
<%--<a href="add.jsp">添加新信息</a>--%>
<input type="button" value="添加新信息" οnclick="myAction('-1','add')"/>
</td>
</tr>
<tr>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>爱好</th>
<th>城市</th>
<th>描述</th>
<th>操作</th>
</tr>
<%for(int i=0;i<list.size();i++){
UserInfo obj=(UserInfo)list.get(i);%>
<!--Html代码-->
<tr>
<td><%=obj.getId()%></td>
<td><%=obj.getUser_name()%></td>
<td><%=obj.getUser_sex()%></td>
<td><%=obj.getUser_age()%></td>
<td><%=obj.getUser_hobby()%></td>
<td><%=obj.getUser_city()%></td>
<td><%=obj.getMtext()%></td>
<td>
<%--
<a href="doRemove.jsp?id=<%=obj.getId()%>">删除</a>
<a href="update.jsp?id=<%=obj.getId()%>">修改</a>
--%>
<input type="button" value="删除" οnclick="myAction('<%=obj.getId()%>','remove')"/>
<input type="button" value="修改" οnclick="myAction('<%=obj.getId()%>','update')"/>
</td>
</tr>
<%}%>
</table>
</form>
</body>
</html>
contorl.jsp
.JSP希望向2.JSP传递当前的用户名字,如何传递这一数据呢?先在1.JSP中调用如下setAttribute()方法:<ol class="dp-xml"><li class="alt"><span><span class="tag"><strong><span style="color:#006699;"><</span></strong></span><span>% </span></span></li><li><span>String </span><span class="attribute"><span style="color:#ff0000;">username</span></span><span>=</span><span class="attribute-value"><span style="color:#0000ff;">request</span></span><span>.getParameter("username"); </span></li><li class="alt"><span>request.setAttribute("username",username); </span></li><li><span>%</span><span class="tag"><strong><span style="color:#006699;">></span></strong></span><span> </span></li><li class="alt"><strong><span style="color:#006699;"><span class="tag"><</span><span class="tag-name">jsp:forward</span></span></strong><span> </span><span class="attribute"><span style="color:#ff0000;">page</span></span><span>=</span><span class="attribute-value"><span style="color:#0000ff;">"2.jsp"</span></span><span> </span><span class="tag"><strong><span style="color:#006699;">/></span></strong></span><span> </span></li><li><span>在2.jsp中通过getAttribute()方法获得用户名字: </span></li><li class="alt"><span class="tag"><strong><span style="color:#006699;"><</span></strong></span><span>% String </span><span class="attribute"><span style="color:#ff0000;">username</span></span><span>=(String)request.getAttribute("username"); %</span><span class="tag"><strong><span style="color:#006699;">></span></strong></span><span>
</span></li></ol><%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<%
//控制器会接收index.jsp页面中所有的提交和请求
//然后根据提交的操作类型分发给具体的业务页面处理
//这样一来便可实现单表单处理多种操作的情况
request.setCharacterEncoding("UTF-8");
//获取操作标识
String actionType=request.getParameter("actionType");
if(actionType.equalsIgnoreCase("add")){
//前往添加表单的页面
//response.sendRedirect("add.jsp");
request.getRequestDispatcher("add.jsp").forward(request, response);
}else if(actionType.equalsIgnoreCase("update")){
//前往修改表单的页面
//不使用response.sendRedirect的方式来分发业务页面
//String id=request.getParameter("id");
//response.sendRedirect("update.jsp?id="+id);
//而是使用转发操作来分发页面页面,因为转发操作有个最大的特点:转发后的页面共享同一个request对象
int id=Integer.parseInt(request.getParameter("id"));
UserInfoDao dao=new UserInfoDao();
UserInfo obj=dao.findById(id);
//request除了是请求对象外,还可以当成容器集合使用
//setAttribute可以保存任意类型的数据,然后在另外一个页面获取
//当然前提条件是另外一个页面的request和当前这个request必须是同一个
request.setAttribute("obj", obj);
request.getRequestDispatcher("update.jsp").forward(request, response);
}else if(actionType.equalsIgnoreCase("remove")){
//前往删除操作页面
request.getRequestDispatcher("doRemove.jsp").forward(request, response);
}else{
response.sendRedirect("index.jsp");
}
/*关于转发和重定向
在JSP中有两种方式可以实现页面跳转,一种称为重定向response.sendRedirect(url);
另外一种称为转发request.getRequestDispatcher(uri).forward(request, response);
这2种跳转的方式从结果上来说是一样,都可以实现页面的跳转
但是有很多细节上的差异,导致这2种操作实际效果差别很大
重定向response.sendRedirect(url)
重定向的流程:
浏览器请求A页面,在A页面中执行了response.sendRedirect(url),那么此时响应信息中就会写入指定的url
这个url可以是任何地址,甚至是其他站点的资源,不过需要注意的是,此时并不会马上发生跳转操作
而是等待整个页面的代码执行完毕,响应结果给浏览器的时候,这个写入的url会同时传回给浏览器
浏览器接收响应的时候自然会接收到这个url,然后浏览器会向这个url发出新的请求
从而导致页面被跳转为这个url所表示的页面
简单的说重定向的操作是浏览器完成的,浏览器一共发送了2次请求
第一次请求获得重定向的地址
第二次请求是前往重定向的地址
最终页面显示重定向地址的内容,并且由于是浏览器发出的请求,所以地址栏会更新为最新的地址
转发request.getRequestDispatcher(uri).forward(request, response);
转发的流程
浏览器请求A页面,在A页面中执行了request.getRequestDispatcher(uri).forward(request, response),
那么此时服务器会将uri地址的页面找出来,但是此时还不会执行跳转
另外uri必须是当前站点的资源,不能是其他站点的资源
等整个页面代码处理完毕,服务器会将请求和响应对象通过forward方法传递给uri指定的页面
同时将处理操作移交给uri页面(传统情况下应该是响应当前A页面给浏览器)
由于整个操作对于浏览器来说只请求了A,至于服务器方面的操作移交浏览器毫不知情
所以浏览器的地址还是最开始请求的地址,但是显示的页面已经是服务器移交操作之后的页面
并且由于forward将request和response2个隐式对象继续传递,
所以移交操作后的uri页面和A页面共用同一个request和response对象
简单的说转发的操作是服务器的操作,浏览器完全不知道
*/
%<span style="font-size:18px;">>
</span>
两个页面间如何实现传递值
.JSP希望向2.JSP传递当前的用户名字,如何传递这一数据呢?先在1.JSP中调用如下setAttribute()方法:
- <%
- String username=request.getParameter("username");
- request.setAttribute("username",username);
- %>
- <jsp:forward page="2.jsp" />
- 在2.jsp中通过getAttribute()方法获得用户名字:
- <% String username=(String)request.getAttribute("username"); %>
1.request.getParameter()取得是通过容器的实现来取得通过类似post,get等方式传入的数据,request.setAttribute()和getAttribute()只是在web容器内部流转,仅仅是请求处理阶段。
2.request.getParameter()方法传递的数据,会从Web客户端传到Web服务器端,代表HTTP请求数据。request.getParameter()方法返回String类型的数据。
request.setAttribute()和getAttribute()方法传递的数据只会存在于Web容器内部还有一点就是,HttpServletRequest类有setAttribute()方法,而没有setParameter()方法。拿一个例子来说一下吧,假如两个WEB页面间为链接关系时,就是说要从1.JSP链接到2.JSP时,被链接的是2.JSP可以通过getParameter()方法来获得请求参数.
update.jsp
<%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");
//request.getParameter获取参数有三种情况:
//1.有值,那么获取对应这个name的值
//2.没值,那么得到空字符串,注意空字符串不是null,而是""
//3.name根本不存在,得到的是null
//request.getParameterValues获取参数有两种情况
//1.有值,有多少拿多少,返回固定为String数组,只是长度跟随数量
//2.没值或name根本不存在,那么返回为null
//这里用request.getAttribute("obj");来接收来自contrl.jsp页面的的obj
UserInfo obj=(UserInfo)request.getAttribute("obj");
//准备好常量
ArrayList sexs=new ArrayList();
sexs.add("男");
sexs.add("女");
ArrayList hobbys=new ArrayList();
hobbys.add("唱歌");
hobbys.add("跳舞");
hobbys.add("阅读");
ArrayList citys=new ArrayList();
citys.add("北京");
citys.add("南京");
citys.add("成都");
citys.add("杭州");
citys.add("深圳");
citys.add("西安");
citys.add("长沙");
citys.add("武汉");
citys.add("上海");
%>
<html>
<head>
<title></title>
</head>
<script type="text/javascript">
function myBack(){
location.href="index.jsp";
}
function mySubmit(){
var name=document.forms[0].user_name;
var name_msg=document.getElementById("name_msg");
var hobby_msg=document.getElementById("hobby_msg");
name_msg.innerHTML="";
hobby_msg.innerHTML="";
if(name.value.length==0){
name_msg.innerHTML="<font color='red'>*姓名为必填项</font>";
name.focus();
return ;
}
var hobby_item=document.forms[0].user_hobby;
var flag=false;
for(var i=0;i<hobby_item.length;i++){
if(hobby_item[i].checked==true){
flag=true;
break;
}
}
if(flag==false){
hobby_msg.innerHTML="<font color='red'>*至少选择一个爱好</font>";
return ;
}
document.forms[0].submit();
}
</script>
<body>
<h1 align="center">修改信息</h1>
<form action="doUpdate.jsp" method="post" >
<input type="hidden" name="id" value="<%=obj.getId()%>">
<table align="center" width="50%">
<!-- 姓名 -->
<tr>
<td align="right" width="37%">姓名:</td>
<td align="left" width="25%"><input type="text" name="user_name" value="<%=obj.getUser_name()%>" ></td>
<td>
<div id="name_msg" align="left"></div>
</td>
</tr>
<!-- 性别 -->
<tr>
<td align="right">性别:</td>
<td align="left" colspan="2">
<%for(int i=0;i<sexs.size();i++){%>
<input type="radio" name="user_sex" value="<%=sexs.get(i).toString()%>"
<%if(obj.getUser_sex().equalsIgnoreCase(sexs.get(i).toString())){%>
checked="checked"
<% } %>
/><%=sexs.get(i).toString()%>
<% } %>
</td>
</tr>
<!-- 年龄 -->
<tr>
<td align="right">年龄:</td>
<td align="left" colspan="2"><select name="user_age">
<% for(int i=18;i<=30;i++){%>
<option value="<%=i%>" <%if(obj.getUser_age()==i){out.print("selected='selected'");} %>><%=i%></option>
<%} %>
</select></td>
</tr>
<!-- 爱好 -->
<tr>
<td align="right">爱好:</td>
<td align="left">
<%for(int i=0;i<hobbys.size();i++){%>
<input type="checkbox" name="user_hobby" value="<%=hobbys.get(i).toString()%>"<%if(obj.getUser_hobby().indexOf(hobbys.get(i).toString())!=-1){%>checked="checked"<%}%>/><%=hobbys.get(i).toString()%><% } %>
</td>
<td>
<div id="hobby_msg"></div>
</td>
</tr>
<!-- 城市 -->
<tr>
<td align="right" valign="middle">城市:</td>
<td align="left" colspan="2"><select name="user_city" multiple="multiple" size="9 ">
<%for(int i=0;i<citys.size();i++){%>
<option value="<%=citys.get(i).toString()%>" <%if(obj.getUser_city().indexOf(citys.get(i).toString())!=-1){%>selected="selected"<%} %>><%=citys.get(i).toString()%> </option>
<%} %>
</select></td>
</tr>
<!-- 描述 -->
<tr>
<td align="right" valign="middle">描述:</td>
<td align="left" colspan="2"><textarea rows="8" name="mtext"><%=obj.getMtext()%></textarea></td>
</tr>
<!-- 按钮 -->
<tr>
<td align="center" colspan="3">
<input type="button" value="修改" οnclick="mySubmit()">
<input type="button" value="返回" οnclick="myBack()">
</td>
</tr>
</table>
</form>
</body>
</html>