美文网首页
九、页面跳转

九、页面跳转

作者: lifeline张 | 来源:发表于2018-07-14 15:53 被阅读0次

    一、导言

    之前学习过的页面跳转的方法有转发和重定向。还可以使用<jsp:forward>进行跳转。
    语法:

    <jsp:forward page="URL">
    

    这种写法的效果跟转发完全一样,也能把转发传递下去,

    二、实例分析

    需求:编写添加新闻页面,实现添加新闻的功能。并使用<jsp:forward>实现页面跳转到新闻列表页面
    实现思路:
    1、编写添加新闻页面,实现添加新闻的功能
    2、使用<jsp:forward>实现页面跳转到新闻列表页面

    2.1第一步

    当用户点击添加新闻的页面的时候,跳转到newsDetailCreateSimple.jsp这个页面:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <html>
        <head>
            <link href="<%=request.getContextPath() %>/css/common.css" rel="stylesheet" type="text/css" />
            <script type="text/javascript" src="<%=request.getContextPath() %>/ckeditor/ckeditor.js"> </script>
        </head>
    <body>
    <form name ="dataFrm" id="dataFrm" action="doAdd.jsp" method="post"  enctype="multipart/form-data">
        <table  width="100%" border="0" cellspacing="5" cellpadding="0">
            <thead>
                <tr><td align="center" colspan="2" class="text_tabledetail2">增加新闻</td></tr>
            </thead>
            <tbody>
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">分类</td>
                    <td style="text-align:left;"> 
                    <!-- 列出所有的新闻分类 -->
                        <select name="categoryId">
                            <option value="1">国内</option>
                            <option value="2">国际</option>
                            <option value="3">娱乐</option>
                            <option value="4">军事</option>
                            <option value="5">财经</option>
                            <option value="6">天气</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">标题</td>
                    <td style="text-align:left;"><input type="text" name="title" value=""/></td>
                </tr>
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">作者</td>
                    <td style="text-align:left;"><input type="text" name="author" value=""/></td>
                </tr>
                
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">摘要</td>
                    <td style="text-align:left;"><textarea id="summary" name="summary" rows="8" cols="50"></textarea></td>
                </tr>
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">内容</td>
                    <td style="text-align:left;">
                    <div id="xToolbar"></div>
                    <textarea id="newscontent" name="newscontent" rows="8" cols="30" class="ckeditor"></textarea></td>
                </tr>
                <tr>
                    <td style="text-align:right;" class="text_tabledetail2">上传图片 </td>
                    <td style="text-align:left;"><input type="file" name="picPath" value=""/></td>
                </tr>
                <tr>
                    <td style="text-align:center;" colspan="2">
                        <button type="submit" class="page-btn" name="save">保存</button>
                        <button type="button" class="page-btn" name="return" onclick="javascript:location.href='newsDetailList.jsp'">返回</button>
                    </td>
                </tr>
            </tbody>
        </table>
    </form>
    </body>
    </html>
    

    2.2第二步

    1、在newsDetailCreateSimple.jsp这个页面输入新闻信息之后,把这些信息提交给数据处理页面doAdd.jsp,在数据处理页面上把这些数据保存到数据库之后,再进行重定向。
    2、在newsDetailCreateSimple.jsp页面上可以看到时没有id这个属性的,但是之前在写dao方法的时候的增加新闻是有id这个属性的,所以要先把这个方法里面的id给去掉:

    public void addNews(News news){
            String sql = "INSERT INTO news_detail(categoryId, title, " +
                    "summary,content,author, createDate) VALUES(?,?,?,?,?,?);";
            Object[] params = {news.getCategoryId(), news.getTitle(), news.getSummary(),news.getContent(), news.getAuthor(),news.getCreateDate()};
            int i = this.executeUpdate(sql, params);
            if (i > 0) {
                System.out.println("插入资源成功!");
            }
            this.closeSource();
        }
    

    3、页面掉的是Service层的方法,但是之前并没有在该层级写这个方法,所以要加上。此时因为之前写的dao层级的添加新闻的方法是没有返回值的,可以把dao层级的这个方法的返回值设置为布尔型,方便Service层级调用。
    dao层级的增加新闻方法的具体代码如下:

    public boolean addNews(News news){
            boolean flag = false;
            String sql = "INSERT INTO news_detail(categoryId, title, " +
                    "summary,content,author, createDate) VALUES(?,?,?,?,?,?);";
            Object[] params = {news.getCategoryId(), news.getTitle(), news.getSummary(),news.getContent(), news.getAuthor(),news.getCreateDate()};
            int i = this.executeUpdate(sql, params);
            if (i > 0) {
                System.out.println("插入资源成功!");
                flag = true;
            }
            this.closeSource();
            return flag;
        }
    

    在service层级添加增加新闻的方法(接口略,实现类代码如下)

    package cn.kgc.Service.implement;
    
    import java.util.List;
    
    import cn.kgc.Service.NewsService;
    import cn.kgc.dao.NewsDao;
    import cn.kgc.dao.implement.NewsDaoImpl;
    import cn.kgc.pojo.News;
    
    public class NewsServiceImpl implements NewsService{
        private NewsDao newsdao;
        
        public NewsServiceImpl(){
            newsdao = new NewsDaoImpl();
        }
        
        public List<News> getAllNews() {
            return newsdao.getAllNews();
        }
    
        public boolean addNews(News news) {
            return newsdao.addNews(news);
        }
    
    }
    

    数据处理界面的代码:

    <%@page import="com.kgc.pojo.News"%>
    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    <%@include file="../common/common.jsp" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <base href="<%=basePath%>">
        
        <title>My JSP 'doAdd.jsp' starting page</title>
        
        <meta http-equiv="pragma" content="no-cache">
        <meta http-equiv="cache-control" content="no-cache">
        <meta http-equiv="expires" content="0">    
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="This is my page">
        <!--
        <link rel="stylesheet" type="text/css" href="styles.css">
        -->
    
      </head>
      
      <body>
      <%
       // 点击增加按钮后跳转的页面,在该页面需要调用后台的新闻增加功能
       // 增加成功后要跳转到新闻列表页面admin.jsp
       // 增加失败后要跳转到增加新闻页面newsDetailCreateSimple.jsp 
       request.setCharacterEncoding("utf-8");
       
       // 从表单中获取提交的数据
       News news = new News();
       String test = request.getParameter("categoryId");
       news.setCategoryId(Integer.parseInt(test));
       String title = request.getParameter("title");
       String author = request.getParameter("author");
       String summary = request.getParameter("summary");
       String newscontent = request.getParameter("newscontent");
       
       // 将以上数据封装到一个新闻对象里面
       news.setTitle(title);
       news.setAuthor(author);
       news.setSummary(summary);
       news.setContent(newscontent);
       news.setCreateDate(new Date());
       
       // 调用后台方法将news新闻对象保存到数据库中
       boolean flag = newsService.add(news); 
       // 这个地方不把跳转写到尖括号百分号里面的原因是:
       // 跳转操作是一个标签,标签不能写在这里面
       if (flag) {
       %>
       <jsp:forward page="newsDetailList.jsp"></jsp:forward>
       <% 
       } else {
       %>
       <jsp:forward page="newsDetailCreateSimple.jsp"></jsp:forward>
       <% 
       }
       %>
             
      </body>
    </html>
    

    三、Bug

    3.1bug1

    上面这段代码在运行的时候会出现错误,不知道为什么:


    image.png

    bug的源头在于数据来源页面form表单的提交方式,当使用post提交的时候,使用这种方式拿到的值为null,但是使用get的时候可以正确地拿到值。
    这个跟这两种方式提交数据后数据的保存形式有关,这个地方可以先不细究,等到sverlet的时候再看。

    3.2bug2

    image.png

    不知道为什么。

    3.3bug3

    我自己写的newsTest无法部署到Tomcat上,而news确可以部署到上面.

    这个可能是因为newsTest里面的项目也是导入的news,所以部署的时候只认一个。

    相关文章

      网友评论

          本文标题:九、页面跳转

          本文链接:https://www.haomeiwen.com/subject/nvjypftx.html