写点什么

Java 高手速成 | JSP MVC 模式项目案例

作者:TiAmo
  • 2023-01-31
    江苏
  • 本文字数:7735 字

    阅读完需:约 25 分钟

Java高手速成 | JSP MVC模式项目案例

MVC 模式的核心思想是有效地组合“视图”“模型”和“控制器”。在 JSP 技术中,视图是一个或多个 JSP 页面,其作用主要是向控制器提交必要的数据和为模型提供数据显示;模型是一个或多个 Javabean 对象,用于存储数据;控制器是一个或多个 servlet 对象,根据视图提交的要求进行数据处理操作,并将有关的结果存储到 Javabean 中,然后 servlet 使用重定向方式请求视图中的某个 JSP 页面更新显示。

在 MVC 模式中,模型也可以由控制器负责创建和初始化。

01、等差、等比级数和

1.项目目的

掌握 MVC 模式三部分的设计。使用 request bean 存储数据,使用 servlet 处理数据,并将有关数据存储到 request bean,使用 JSP 页面显示 requestbean 数据。

2.项目要求

(1)编写一个创建 bean 的类,该类可以储存等差(等比)级数的首项、公差(公比)和等差(等比)级数的和。

(2)编写一个 JSP 页面 inputNumber.jsp。该页面提供 form 表单,该 form 表单提供用户输入等差(等比)级数的首和公差(公比)。用户单击名字“求等差级数和”的提交键或名字“求等比级数和”的提交键请求名字是 computSum 的 servlet。

(3)编写创建 servlet 的 Servlet 类,该类创建的 servlet 根据有户提交的数据,负责创建一个 request bean。如果用户单击的是“求等差级数和”(“求等比级数和”)的提交键,servlet 计算等差(等比)级数的和,并将结果存储到 request bean,并请求 inputNumber.jsp 页面显示等差(等比)级数的和。

(4)在 Tomcat 服务器的 webapps 目录下新建一个名字是 ch7_priatice_one 的 Web 服务目录。把 JSP 页面保存到 ch7_priatice_one 中。在 ch7_priatice_one 下建立子目录 WEB-INF(字母大写),然后在 WEB-INF 下再建立子目录 classes,将创建 servlet 和 bean 的类的 Java 源文件按着包名保存在 classes 的相应子目录中。

(5)向 ch7_priatice_one\WEB\INF\下的部署文件 web.xml 添加 servlet 和 servlet-mapping 标记,部署 servlet 的名字和访问 servlet 的 url-pattern。

(6)用浏览器访问 JSP 页面 inputNumber.jsp。


3.参考代码

代码仅供参考,参考代码运行效果如图 7.5。

1. bean(模型)

用命令行进入 save\data 的父目录 classes,编译 Series_Bean.java:

classes>javac save\data\Series_Bean.java

Series_Bean.java:

 package save.data;public classSeries_Bean{   double firstItem;  //级数首项。   double var;        //公差或公比。   int number;        //求和项数。   double sum;       //求和结果。   String name="";   //级数类别。   public void setFirstItem(double a){      firstItem=a;   }   public double getFirstItem(){      return firstItem;   }   public void setVar(double b){      var=b;   }   public double getVar(){      return var;   }   public void setNumber(int n){      number=n;   }   public double getNumber(){      return number;   }   public void setSum(double s){      sum=s;   }   public double getSum(){      return sum;   }   public void setName(String na){      name=na;   }   public String getName(){     return name;   }}
复制代码

2. JSP 页面(视图)

inputNumber.jsp 提供 form 表单,该 form 表单提供用户输入等差(等比)级数的首和公差(公比)。用户单击名字“求等差级数和”的提交键或名字“求等比级数和”的提交键请求名字是 computSum 的 servlet。

inputNumber.jsp(效果如图 7.5 所示)

 <%@ pagecontentType="text/html" %><%@ page pageEncoding= "utf-8" %><jsp:useBeanid="seriesData" class ="save.data.Series_Bean"scope="request"/><style>   #tom{      font-family:宋体;font-size:28;color:blue   }</style><HTML><bodybgcolor=#FFBBFF><formaction="computeSum" id = tom method="post" >等差级数求和:  <br>输入首项:<input type=text id=tom name="firstItem" size=4>      输入公差(公比):<inputtype=text id=tom name="var" size=4>      求和项数:<input type=text id=tom name="number" size=4>  <input type=submit name ="submit" id = tom value="提交(求等差级数和)"/>  <input type=submit name = "submit"id = tom value="提交(求等比级数和)"></form><table border=1 id =tom>   <tr>    <th> 级数的首项</th>    <th> <jsp:getPropertyname="seriesData" property="name"/></th>    <th> 所求项数</th>    <th> 求和结果</th>   </tr>    <td><jsp:getPropertyname="seriesData" property="firstItem"/></td>    <td><jsp:getPropertyname="seriesData" property="var"/></td>    <td><jsp:getPropertyname="seriesData" property="number"/></td>    <td><jsp:getPropertyname="seriesData" property="sum"/></td>   </tr></table></body></HTML>
复制代码

3. servlet(控制器)

ComputeSum_Servlet 负责创建名字是 computeSum 的 servlet。名字为 computeSum 的 servlet 控制器负责计算等差或等比级数的和,并将结果存放在 id 是 seriesData 的 request bean 中,然后用重定向的方法,请求 inputNumber.jsp 显示 request bean 中的数据。

用命令行进入 handle\data 的父目录 classes,编译 ComputeSum_Servlet.java:

classes>javac-cp .;servlet-api.jar  handle/data/ComputeSum_Servlet.java
复制代码

事先将 Tomcat 安装目录 lib 子目录中的 servlet-api.jar 文件复制(不要剪贴)到\ch7_practice_one\WEB-INF\classes 中。

注意“.;”和“servlet-api.jar”之间不要有空格,“.;”的作用是保证 Java 源文件能使用 import 语句引入当前 classes 目录中其他自定义包中的类,比如 save.data 包中的 bean 类。

ComputeSum_Servlet.java:

 package handle.data;import save.data.*;import java.io.*;import javax.servlet.*;importjavax.servlet.http.*;public classComputeSum_Servlet extends HttpServlet{   public void init(ServletConfig config)throws ServletException{      super.init(config);   }   public void service(HttpServletRequestrequest,HttpServletResponse response) throws ServletException,IOException{      Series_Bean seriesData = newSeries_Bean(); //创建bean。      request.setCharacterEncoding("utf-8");      request.setAttribute("seriesData",seriesData);//request bean。      String mess=request.getParameter("submit");      String firstItem =request.getParameter("firstItem");//首项。      String var =request.getParameter("var");//或公比公差。      String number =request.getParameter("number");//求和项数。      if(firstItem.length()==0||var.length()==0||number.length() == 0){           response.sendRedirect("inputNumber.jsp");            return;      }      if(mess.contains("等差")) {         compute(firstItem,var,number,seriesData,0);      }      else if(mess.contains("等比")) {        compute(firstItem,var,number,seriesData,1);      }      //请求inputNumber.jsp显示seriesData中的数据:      RequestDispatcher dispatcher=      request.getRequestDispatcher("inputNumber.jsp");      dispatcher.forward(request,response);    }     void compute(String firstItem,Stringvar,String number,Series_Bean seriesData,inttype){      double a=Double.parseDouble(firstItem);      double d=Double.parseDouble(var);      int n=Integer.parseInt(number);      seriesData.setFirstItem(a); //将数据存储在数据模型seriesData中。      seriesData.setVar(d);                seriesData.setNumber(n);      double sum=0,item=a;      int i=1;      if(type == 0) {         seriesData.setName("等差级数的公差");         while(i<=n){       //计算等差数列的和。            sum=sum+item;            i++;            item=item+d;          }         seriesData.setSum(sum);      }      else if(type == 1){         seriesData.setName("等比级数的公比");         while(i<=n){       //计算等比数列的和。            sum=sum+item;            i++;            item=item*d;          }         seriesData.setSum(sum);      }   }}
复制代码

4.web.xml(部署文件)

向 ch7_practice_one\WEB\INF\下的 web.xml 添加如下的 servlet 和 servlet-mapping 标记,部署的 servlet 的名字是 computeSum,访问 servlet 的 url-pattern 是/ computeSum。

web.xml:

 <?xmlversion="1.0" encoding="utf-8"?><web-app>    <!-- 以下是web.xml文件新添加的内容 -->    <servlet>        <servlet-name>computeSum</servlet-name>        <servlet-class>handle.data.ComputeSum_Servlet</servlet-class>    </servlet>    <servlet-mapping>        <servlet-name>computeSum</servlet-name>        <url-pattern>/computeSum</url-pattern>    </servlet-mapping></web-app>
复制代码

02、点餐


1.项目目的


掌握 MVC 模式三部分的设计。使用 session bean 存储数据,使用 servlet 处理数据,并将有关数据存储到 session bean,使用 JSP 页面显示 sessionbean 数据。


2.项目要求

(1)编写一个创建 bean 的类,该类可以储存餐单相关的数据,例如菜名,价格等信息。


(2)编写一个 JSP 页面 inputMenu.jsp。该页面提供 1 个 form 表单,该表单提供用户输入餐单信息。用户单击名字“添加到餐单”的提交键请求名字是 addMenu 的 servlet。


(3)编写创建 servlet 的 Servlet 类,该类创建的 servlet 根据有户提交的餐单数据,解析出餐单的消费总额,并将餐单中消费分项按价格排序,并将这些信息存放到 session bean 中。servlet 请求 showMenu.jsp 页面显示 session bean 中的数据。


(4)编写 showMenu.jsp 页面,该页面显示或删除 session bean 中的数据(显示餐单,同时也可以删除餐单中的某道菜)。


(5)在 Tomcat 服务器的 webapps 目录下(比如,D:\apache-tomcat-9.0.26\webapps)新建名字是 ch7_priatice_two 的 Web 服务目录。把 JSP 页面保存到 ch7_priatice_two 中。在 ch7_priatice_two 下建立子目录 WEB-INF(字母大写),然后在 WEB-INF 下再建立子目录 classes,将创建 servlet 和 bean 的类的 Java 源文件按着包名保存在 classes 的相应子目录中。


(6)向 ch7_priatice_two\WEB\INF\下的部署文件 web.xml 添加 servlet 和 servlet-mapping 标记,部署 servlet 的名字和访问 servlet 的 url-pattern。


(7)用浏览器访问 JSP 页面 inputMenu.jsp。


3.参考代码

代码仅供参考,参考代码运行效果如图 7.6。



    创建 session bean 需要使用 MenuBean 类, Food 类是 MenuBean 类需要的一个类。


    用命令行进入 save\data 的父目录 classes,编译 Food.java 和 MenuBean.java:


    classes>javac save\data\Food.java


    classes>javac save\data\MenuBean.java


    Food.java:

     package save.data;public class Foodimplements Comparable<Food>{    String foodName ;   //食物名称。    double price;       //价格。    public void setFoodName(String name){        foodName = name;    }     public String getFoodName(){        return foodName;    }     public void setPrice(double d){        price = d;    }     public double getPrice(){        return price;    }     public int compareTo(Food food){ //Food对象按价格比较大小。        return(int)(food.getPrice()*1000-price*1000);    }}
    复制代码

    MenuBean.java:

     package save.data;importjava.util.ArrayList;importjava.util.Collections;public class MenuBean {    String time ; //点餐时间。    String totalPrice; //餐单总额。    ArrayList<Food> foodList;//存放Food对象的ArrayList。    public MenuBean(){        foodList = new ArrayList<Food>();    }     public void addFood(Food food){        foodList.add(food);        Collections.sort(foodList);//排序foodList。    }     public void removeFood(int index){        if(index>=0){           foodList.remove(index);           Collections.sort(foodList);//排序foodList。        }    }     public String getFoodName(int index) {//返回某个Food的名字。        returnfoodList.get(index).getFoodName();    }     public double getPrice(int index) {   //返回某个Food的价格。        return foodList.get(index).getPrice();    }     public int size() {        return foodList.size();    }     public void setTime(String time){        this.time = time;     }     public String getTime(){        return time;     }     public String getTotalPrice(){        double sum = 0;        for(Food food:foodList){          sum += food.getPrice();        }         totalPrice =String.format("%.2f",sum);//保留2位小数。        return totalPrice;    }}
    复制代码

    2. JSP 页面(视图)

    inputMenu.jsp 提供 form 表单,该 form 表单提供用户输入某道菜的名字和价格。用户单击名字“添加到餐单”的提交键请求名字是 addMenu 的 servlet。showMenu.jsp 负责显示 session bean 中的数据,以及删除 sessionbean 中的某个数据(即删除某道菜)。

    inputMenu.jsp(效果如图 7.6(a)所示)

     <%@ pagecontentType="text/html" %><%@ page pageEncoding= "utf-8" %><jsp:useBeanid="menu" class ="save.data.MenuBean"scope="session"/><style>   #textStyle{      font-family:宋体;font-size:36;color:blue   }</style><HTML><bodybgcolor=#ffccff><formaction="addMenu" id= textStyle method=post>输入餐单(每次输入一个消费项目):<br>名称:<inputtype=text name='foodName' id =textStyle value ='剁椒鱼头' size = 8 />价格:<inputtype=text name='price' id =textStyle value ='26.9' size = 8 /><br><inputtype=submit id=textStyle value="添加到餐单"></form></body></HTML>
    复制代码

     showMenu.jsp(效果如图 7.6(b)所示)

     <%@ pagecontentType="text/html" %><%@ page pageEncoding= "utf-8" %><jsp:useBeanid="menu" class ="save.data.MenuBean"scope="session"/><style>   #tom{      font-family:宋体;font-size:26;color:blue   }</style> <HTML><bodybgcolor=pink><table border=1>   <tr><th id=tom>序号</th><th id=tom>食物名称</th><th id=tom>价格</th>   <% request.setCharacterEncoding("utf-8");    String index = request.getParameter("删除");    if(index!=null){      menu.removeFood(Integer.parseInt(index));    }     for(int i=0;i<menu.size();i++){        out.print("<tr>");        out.print("<tdid=tom>"+(i+1)+"</td>");        out.print("<tdid=tom>"+menu.getFoodName(i)+"</td>");        out.print("<tdid=tom>"+menu.getPrice(i)+"</td>");        out.print("<td ><formaction ="+"showMenu.jsp"+" method=post>");        out.print("<input type = hiddenname = 删除 value ="+i+" />");        out.print("<input type =submit  value = 删除该食物 />");        out.print("</form></td>");        out.print("</tr>");    }%> </table> <p id = tom>餐单总额(共有<%=menu.size()%>道食物): <jsp:getPropertyname="menu" property="totalPrice" /><br>点餐时间:<jsp:getProperty  name="menu"property="time" /></p><a id =tomhref="inputMenu.jsp">继续点餐</a></body></HTML>


    复制代码

    3. servlet(控制器)

    HandleMenu_Servlet 负责创建名字是 addMenu 的 servlet。名字为 addMenu 的 servlet 控制器负责创建 id 是 menu 的 session bean,并将 Food 对象存储到 session bean 中,然后将用户重定向到 showMenu.jsp 页面查看餐单。 用命令行进入 handle\data 的父目录 classes,编译 HandleMenu_Servlet.java:

    classes>javac-cp .;servlet-api.jar  handle/data/HandleMenu_Servlet.java
    复制代码

    事先将 Tomcat 安装目录 lib 子目录中的 servlet-api.jar 文件复制(不要剪贴)到\ch7_practice_one\WEB-INF\classes 中。

    注意“.;”和“servlet-api.jar”之间不要有空格,“.;”的作用是保证 Java 源文件能使用 import 语句引入当前 classes 目录中其他自定义包中的类,比如 save.data 包中的 bean 类。

    HandleMenu_Servlet.java

    package handle.data;import save.data.Food;importsave.data.MenuBean;import java.util.*;import java.io.*;importjava.time.LocalTime;import javax.servlet.*;importjavax.servlet.http.*;public classHandleMenu_Servlet extends HttpServlet{   public void init(ServletConfig config)throws ServletException{       super.init(config);   }   public void service(HttpServletRequestrequest,   HttpServletResponse response)throws ServletException,IOException{       request.setCharacterEncoding("utf-8");       MenuBean menu  = null; //餐单。       HttpSessionsession=request.getSession(true);       menu = (MenuBean)session.getAttribute("menu");       if(menu == null ){//menu不存在就创建menu。           menu = new MenuBean();          session.setAttribute("menu",menu);//sesion bean。       }        String foodName =request.getParameter("foodName");//食物名称。       String price =request.getParameter("price");       Food food = new Food();       if(foodName.length()==0||price.length()==0){            response.sendRedirect("inputMenu.jsp");            return;       }       food.setFoodName(foodName);       food.setPrice(Double.parseDouble(price));       LocalTime dateTime =LocalTime.now();        String str = dateTime.toString();       String time=str.substring(0,str.lastIndexOf("."));//不要纳秒。       menu.setTime(time);       menu.addFood(food);//添加一道食物。       response.sendRedirect("showMenu.jsp");//显示餐单。   }
    复制代码

    4.web.xml(部署文件)

    向 ch7_practice_two\WEB\INF\下的 web.xml 添加如下的 servlet 和 servlet-mapping 标记,部署的 servlet 的名字是 addMenu,访问 servlet 的 url-pattern 是/ addMenu。

    web.xml:

     <?xmlversion="1.0" encoding="utf-8"?><web-app>    <!-- 以下是web.xml文件新添加的内容 -->    <servlet>        <servlet-name>addMenu</servlet-name>        <servlet-class>handle.data.HandleMenu_Servlet</servlet-class>    </servlet>    <servlet-mapping>        <servlet-name>addMenu</servlet-name>        <url-pattern>/addMenu</url-pattern>    </servlet-mapping></web-app>
    复制代码


    发布于: 刚刚阅读数: 3
    用户头像

    TiAmo

    关注

    有能力爱自己,有余力爱别人! 2022-06-16 加入

    CSDN全栈领域优质创作者;阿里云创作者社区专家博主、技术博主、星级博主、阿里云ACE;华为云享专家;

    评论

    发布
    暂无评论
    Java高手速成 | JSP MVC模式项目案例_mvc_TiAmo_InfoQ写作社区