标签：水果 String 管理系统 int Connection import public conn

1. 概述

水果管理系统是最简单的一个javaWeb项目，主要对水果表进行增删改查。

• 页面上有添加水果按钮，点击后可以跳转到添加页面，添加水果（增）
• 有关键字查询，在页面上输入关键字，可以按照关键字检索，没有关键字就默认全部，页面展示了查询出来的数据（查）
• 数据名称有一个链接，点击后可以到编辑页面，修改这个数据（改）
• 数据旁边有一个删除按钮，点击后删除数据（删）
• 展示页面按5条一页的形式进行分页（分页）

2. 数据库设计

一共一张fruit表，有5个字段，fid为主键，设置自增。其他的分别是名称，价格，库存和备注。

3. JDBC与数据库连接

3.1 设置数据连接的properties文件

在src目录下，创建JDBC.properties。

user=root
password=123456
url=jdbc:mysql://localhost:3306/atguigu
driverClass=com.mysql.cj.jdbc.Driver

3.2 导入JDBC需要的jar包

在工程下新建一个lib文件夹，将官网上下载下来的jar包导入，右键Add as Library。

3.3 编写JDBC工具类

package com.zhen.util;

import java.io.InputStream;
import java.sql.*;
import java.util.Properties;

// 把数据库连接和资源释放都封装起来
public class JDBCUtils {
    public static Connection getConnection() throws Exception {
        //1.加载配置文件
        //用线程的上下文类加载器将文件变成一个输入流
        InputStream is = Thread.currentThread().getContextClassLoader().getResourceAsStream("jdbc.properties");
        Properties pros = new Properties();
        pros.load(is);
        //2.读取配置信息
        String user = pros.getProperty("user");
        String password = pros.getProperty("password");
        String url = pros.getProperty("url");
        String driverClass = pros.getProperty("driverClass");
        //3.加载驱动
        Class clazz = Class.forName(driverClass);
        //4.获取连接
        Connection conn = DriverManager.getConnection(url, user, password);
        return conn;
    }
    public static void closeResource(Connection conn, Statement ps) {  //传入需要关闭的资源
        if (conn != null) {
            try {
                conn.close();
            } catch (SQLException e) {
                throw new RuntimeException(e);
            }
        }
        if (ps != null) {
            try {
                ps.close();
            } catch (SQLException e) {
                throw new RuntimeException(e);
            }
        }
    }
    public static void closeResource(Connection conn, Statement ps, ResultSet rs) {  //传入需要关闭的资源,构成重载
        if (conn != null) {
            try {
                conn.close();
            } catch (SQLException e) {
                throw new RuntimeException(e);
            }
        }
        if (ps != null) {
            try {
                ps.close();
            } catch (SQLException e) {
                throw new RuntimeException(e);
            }
        }
        if (rs != null) {
            try {
                rs.close();
            } catch (SQLException e) {
                throw new RuntimeException(e);
            }
        }
    }
}

4. 编写pojo

这里只有一张表，所以只要一个Fruit类即可。

package com.zhen.pojo;

// ORM编程思想,数据库的一张表对应一个类,字段对应属性
public class Fruit {
    private int fid;
    private String fname;
    private double price;
    private int fcount;
    private String remark;

    public Fruit() {
    }

    public Fruit(int fid, String fname, double price, int fcount, String remark) {
        this.fid = fid;
        this.fname = fname;
        this.price = price;
        this.fcount = fcount;
        this.remark = remark;
    }

    public int getFid() {
        return fid;
    }

    public void setFid(int fid) {
        this.fid = fid;
    }

    public String getFname() {
        return fname;
    }

    public void setFname(String fname) {
        this.fname = fname;
    }

    public double getPrice() {
        return price;
    }

    public void setPrice(double price) {
        this.price = price;
    }

    public int getFcount() {
        return fcount;
    }

    public void setFcount(int fcount) {
        this.fcount = fcount;
    }

    public String getRemark() {
        return remark;
    }

    public void setRemark(String remark) {
        this.remark = remark;
    }

    @Override
    public String toString() {
        return "Fruit{" +
                "fid=" + fid +
                ", fname='" + fname + '\'' +
                ", price=" + price +
                ", fcount=" + fcount +
                ", remark='" + remark + '\'' +
                '}';
    }
}

5. 编写DAO层

5.1 编写BaseDao

BaseDao是通用的对数据库进行操作的代码。

package com.zhen.dao;
import com.zhen.util.JDBCUtils;
import java.lang.reflect.Field;
import java.lang.reflect.ParameterizedType;
import java.lang.reflect.Type;
import java.sql.*;
import java.util.ArrayList;
import java.util.List;

// 在之前的版本中,由于通过反射返回的对象,所以在查询函数中都要传入一个当前类的对象,但实际上我们可以通过将BaseDAO变成泛型类,在初始化时通过反射获取父类的泛型,就可以直接获取这个当前类的对象了,就不必再每次都传入当前类的对象了。
// 把BaseDao变成泛型类,在子类继承时确定要操作的类,省去了之前对类的指定
public abstract class BaseDao<T> {
    // 通用的增删改操作
    private Class<T> clazz = null;

    // 写在代码块内,在实现类的子类创建时初始化clazz,获得子类的类型
    {
        Type genericSuperclass = this.getClass().getGenericSuperclass();    // 注意,这里的this是当前类,即初始化时的子类
        ParameterizedType paramType = (ParameterizedType) genericSuperclass;   // 强转为ParameterizedType类
        //获取泛型类型
        Type[] actualTypeArguments = paramType.getActualTypeArguments();  // 调用这个方法获取泛型
        clazz = (Class<T>) actualTypeArguments[0];      //获得第一个参数,即对应的泛型,获得对应的子类的类对象
    }

    public int update(Connection conn, String sql, Object ... args){
        PreparedStatement ps = null;
        try {
            ps = conn.prepareStatement(sql);
            for(int i = 0;i < args.length;i++){
                ps.setObject(i + 1, args[i]);	//这里直接使用setObject，注意下标从1开始
            }
            return ps.executeUpdate();
        } catch (Exception e) {
            e.printStackTrace();
        }finally{
            JDBCUtils.closeResource(null, ps);
        }
        return 0;
    }
    // 获取一个对象
    public T getBean(Connection conn, String sql, Object... args) {   // 这时候就不用传Class对象进来了,直接使用clazz即可
        PreparedStatement ps = null;
        ResultSet rs = null;
        try {
            ps = conn.prepareStatement(sql);
            for (int i = 0; i < args.length; i++) {
                ps.setObject(i + 1, args[i]);
            }
            rs = ps.executeQuery();
            ResultSetMetaData rsmd = rs.getMetaData();
            int columnCount = rsmd.getColumnCount();
            if (rs.next()) {
                T t = clazz.getDeclaredConstructor().newInstance();
                for (int i = 0; i < columnCount; i++) {
                    Object columnVal = rs.getObject(i + 1);
                    String columnLabel = rsmd.getColumnLabel(i + 1);
                    Field field = clazz.getDeclaredField(columnLabel);
                    field.setAccessible(true);
                    field.set(t, columnVal);
                }
                return t;
            }
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            JDBCUtils.closeResource(null, ps, rs);
        }
        return null;
    }
    // 获取所有对象
    public List<T> getForList(Connection conn, String sql, Object... args) {
        PreparedStatement ps = null;
        ResultSet rs = null;
        try {
            ps = conn.prepareStatement(sql);
            for (int i = 0; i < args.length; i++) {
                ps.setObject(i + 1, args[i]);
            }
            rs = ps.executeQuery();
            ResultSetMetaData rsmd = rs.getMetaData();
            int columnCount = rsmd.getColumnCount();
            ArrayList<T> list = new ArrayList<T>();
            while (rs.next()) {
                T t = clazz.getDeclaredConstructor().newInstance();
                for (int i = 0; i < columnCount; i++) {
                    Object columnVal = rs.getObject(i + 1);
                    String columnLabel = rsmd.getColumnLabel(i + 1);
                    Field field = clazz.getDeclaredField(columnLabel);
                    field.setAccessible(true);
                    field.set(t, columnVal);
                }
                list.add(t);
            }
            return list;
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            // 7.关闭资源
            JDBCUtils.closeResource(null, ps, rs);
        }
        return null;
    }
    //获取一个只有一个值的方法，专门用来执行像 select count(*)...这样的sql语句
    public <E> E getValue(Connection conn,String sql, Object... args) {
        PreparedStatement ps = null;
        ResultSet rs = null;
        try {
            ps = conn.prepareStatement(sql);
            for (int i = 0; i < args.length; i++) {
                ps.setObject(i + 1, args[i]);
            }
            rs = ps.executeQuery();
            if (rs.next()) {
                return (E) rs.getObject(1);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } finally {
            JDBCUtils.closeResource(null, ps, rs);
        }
        return null;
    }
}

5.2 编写FruitDao接口

FruitDao接口用于规范对fruit表进行的操作。

package com.zhen.dao;

import com.zhen.pojo.Fruit;

import java.sql.Connection;
import java.util.List;

public interface FruitDao {
    // 添加一条水果数据
    void addFruit(Connection conn, Fruit fruit);

    // 获取所有的水果信息
    List<Fruit> getFruitList(Connection conn);

    // 获取指定关键字指定页码的水果信息
    List<Fruit> getFruitList(Connection conn,String keyword,int pageNo);

    // 根据id获取水果信息
    Fruit getFruitById(Connection conn,int fid);

    // 根据id修改水果信息
    void updateFruit(Connection conn,Fruit fruit);

    // 根据指定的id删除水果信息
    void delFruit(Connection conn,Integer fid);

    // 获取总记录条数
    int getFruitCount(Connection conn, String keyword);
}

5.3 编写FruitDaoImpl

package com.zhen.dao;

import com.zhen.pojo.Fruit;

import java.sql.Connection;
import java.util.List;

public class FruitDaoImpl extends BaseDao<Fruit> implements FruitDao{
    @Override
    public void addFruit(Connection conn, Fruit fruit) {
        String sql = "insert into fruit(fname,price,fcount,remark)values(?,?,?,?)";
        update(conn,sql,fruit.getFname(),fruit.getPrice(),fruit.getFcount(),fruit.getRemark());
    }

    @Override
    public List<Fruit> getFruitList(Connection conn) {
        String sql = "select * from fruit";
        return getForList(conn, sql);
    }

    @Override
    public List<Fruit> getFruitList(Connection conn,String keyword,int pageNo) {
        String sql = "select * from fruit where fname like ? or remark like ? limit ?,5";
        return getForList(conn, sql,"%"+keyword+"%", "%"+keyword+"%",(pageNo-1)*5);
    }

    @Override
    public Fruit getFruitById(Connection conn, int fid) {
        String sql = "select * from fruit where fid = ?";
        return getBean(conn, sql, fid);
    }

    @Override
    public void updateFruit(Connection conn, Fruit fruit) {
        String sql = "update fruit set fname = ?,price = ?,fcount = ?,remark = ? where fid = ?";
        update(conn, sql, fruit.getFname(), fruit.getPrice(), fruit.getFcount(), fruit.getRemark(), fruit.getFid());
    }

    @Override
    public void delFruit(Connection conn, Integer fid) {
        String sql = "delete from fruit where fid = ?";
        update(conn,sql,fid);
    }

    @Override
    public int getFruitCount(Connection conn, String keyword) {
        String sql = "select count(*) from fruit where fname like ? or remark like ?";
        // count(*)查询出来的是Long类型，需要转化为int类型
        return ((Long)getValue(conn,sql,"%"+keyword+"%","%"+keyword+"%")).intValue();
    }
}

6. 编写Servlet层

注意导包：在tomcat的lib目录下找到servlet-api的jar包，复制到刚刚创建的lib目录下。前端需要themeleaf，也是一样的导包。

6.1 编写themeleaf的基类

package com.zhen.servlets;

import org.thymeleaf.TemplateEngine;
import org.thymeleaf.context.WebContext;
import org.thymeleaf.templatemode.TemplateMode;
import org.thymeleaf.templateresolver.ServletContextTemplateResolver;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class ViewBaseServlet extends HttpServlet {

    private TemplateEngine templateEngine;

    @Override
    public void init() throws ServletException {

        // 1.获取ServletContext对象
        ServletContext servletContext = this.getServletContext();

        // 2.创建Thymeleaf解析器对象
        ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver(servletContext);

        // 3.给解析器对象设置参数
        // ①HTML是默认模式，明确设置是为了代码更容易理解
        templateResolver.setTemplateMode(TemplateMode.HTML);

        // ②设置前缀
        String viewPrefix = servletContext.getInitParameter("view-prefix");

        templateResolver.setPrefix(viewPrefix);

        // ③设置后缀
        String viewSuffix = servletContext.getInitParameter("view-suffix");

        templateResolver.setSuffix(viewSuffix);

        // ④设置缓存过期时间（毫秒）
        templateResolver.setCacheTTLMs(60000L);

        // ⑤设置是否缓存
        templateResolver.setCacheable(true);

        // ⑥设置服务器端编码方式
        templateResolver.setCharacterEncoding("utf-8");

        // 4.创建模板引擎对象
        templateEngine = new TemplateEngine();

        // 5.给模板引擎对象设置模板解析器
        templateEngine.setTemplateResolver(templateResolver);

    }

    protected void processTemplate(String templateName, HttpServletRequest req, HttpServletResponse resp) throws IOException {
        // 1.设置响应体内容类型和字符集
        resp.setContentType("text/html;charset=UTF-8");

        // 2.创建WebContext对象
        WebContext webContext = new WebContext(req, resp, getServletContext());

        // 3.处理模板数据
        templateEngine.process(templateName, webContext, resp.getWriter());
    }
}

6.2 编写对应主页面的servlet：IndexServlet

package com.zhen.servlets;

import com.zhen.dao.FruitDaoImpl;
import com.zhen.pojo.Fruit;
import com.zhen.util.JDBCUtils;
import com.zhen.util.StringUtils;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.sql.Connection;
import java.util.List;

// Servlet从3.0版本后开始支持注解的注册,这样就省去了配置web.xml
@WebServlet("/index")
public class IndexServlet extends ViewBaseServlet {
    private FruitDaoImpl fruitDao = new FruitDaoImpl();

    // doPost方法调用doGet,这样就通用了
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("utf-8");
        doGet(req,resp);
    }

    // 处理查询与分页,根据关键词和页码查询数据后返回给前端
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String oper = req.getParameter("oper");
        int pageNo = 1;
        String keyword = null;
        HttpSession session = req.getSession();
        // 如果oper不为空且为search,说明这是前端通过查询按钮来的,我们需要把页数置为1,把keyword放到session中
        if (!StringUtils.isEmpty(oper) && "search".equals(oper)) {
            pageNo = 1;
            keyword = req.getParameter("keyword");
            if (StringUtils.isEmpty(keyword)) {
                keyword = "";
            }
            session.setAttribute("keyword",keyword);
        }else {
            // 否则当前页码从参数中获得
            String pageNoStr = req.getParameter("pageNo");
            if (!StringUtils.isEmpty(pageNoStr)) {
                pageNo = Integer.parseInt(pageNoStr);
            }
            Object keyword1 = session.getAttribute("keyword");
            if (keyword1 == null) {
                keyword = "";
            }else {
                keyword = (String) keyword1;
            }
        }
        Connection conn = null;
        try {
            conn = JDBCUtils.getConnection();
        } catch (Exception e) {
            e.printStackTrace();
        }
        // 获得对应的数量与总页数
        int fruitCount = fruitDao.getFruitCount(conn,keyword);
        int pageCount = (fruitCount+4)/5;
        List<Fruit> fruitList = fruitDao.getFruitList(conn,keyword,pageNo);
        // 信息存到session中
        session.setAttribute("fruitList",fruitList);
        session.setAttribute("pageNo",pageNo);
        session.setAttribute("pageCount",pageCount);
        // 这里的第一个参数是逻辑视图,这样信息就发往视图前缀+逻辑视图+视图后缀
        // 这也是为什么需要这个基类的原因,这样我们才可以把信息通过thymeleaf传给指定的网页
        super.processTemplate("index",req,resp);
    }
}

6.3 编写对应添加水果页面的servlet：AddServlet

package com.zhen.servlets;

import com.zhen.dao.FruitDaoImpl;
import com.zhen.pojo.Fruit;
import com.zhen.util.JDBCUtils;

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 javax.servlet.http.HttpSession;
import java.io.IOException;
import java.sql.Connection;

@WebServlet("/add.do")
public class AddServlet extends ViewBaseServlet {
    private FruitDaoImpl fruitDao = new FruitDaoImpl();
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        // 获取前端传来的信息
        req.setCharacterEncoding("utf-8");
        String fname = req.getParameter("fname");
        int price = Integer.parseInt(req.getParameter("price"));
        int fcount = Integer.parseInt(req.getParameter("fcount"));
        String remark = req.getParameter("remark");
        // 获取数据库连接,插入数据
        Connection connection = null;
        try {
            connection = JDBCUtils.getConnection();
            fruitDao.addFruit(connection, new Fruit(0,fname,price,fcount,remark));
            // 重定向到首页,这样就能刷新数据了
            resp.sendRedirect("index");
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            JDBCUtils.closeResource(connection,null);
        }
    }
}

6.4 编写对应编辑的servlet：EditServlet与UpdateServlet

• 先根据id查询出对应的数据展示在编辑页面

package com.zhen.servlets;

import com.zhen.dao.FruitDaoImpl;
import com.zhen.pojo.Fruit;
import com.zhen.util.JDBCUtils;
import com.zhen.util.StringUtils;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.sql.Connection;

// 根据前端传来的id,跳转到指定的编辑页面,并且查询对应的内容发送到前端
@WebServlet("/edit.do")
public class EditServlet extends ViewBaseServlet{
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String fidStr = req.getParameter("fid");
        FruitDaoImpl fruitDao = new FruitDaoImpl();
        Connection connection = null;
        try {
            connection = JDBCUtils.getConnection();
        } catch (Exception e) {
            e.printStackTrace();
        }
        if (!StringUtils.isEmpty(fidStr)) {
            Fruit fruit = fruitDao.getFruitById(connection, Integer.parseInt(fidStr));
            System.out.println(fruit);
            req.setAttribute("fruit", fruit);
            super.processTemplate("edit",req,resp);
        }
        JDBCUtils.closeResource(connection,null);
    }
}

• 编辑页面写好后再对数据库进行修改

package com.zhen.servlets;

import com.zhen.dao.FruitDaoImpl;
import com.zhen.pojo.Fruit;
import com.zhen.util.JDBCUtils;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.sql.Connection;

@WebServlet("/update.do")
public class UpdateServlet extends ViewBaseServlet{
    private FruitDaoImpl fruitDao = new FruitDaoImpl();
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("utf-8");
        int fid = Integer.parseInt(req.getParameter("fid"));
        String fname = req.getParameter("fname");
        int price = Integer.parseInt(req.getParameter("price"));
        int fcount = Integer.parseInt(req.getParameter("fcount"));
        String remark = req.getParameter("remark");
        Connection connection = null;
        try {
            connection = JDBCUtils.getConnection();
        } catch (Exception e) {
            e.printStackTrace();
        }
        fruitDao.updateFruit(connection,new Fruit(fid,fname,price,fcount,remark));
        resp.sendRedirect("index");
    }
}

7. 编写前端页面

7.1 编写前端展示页面：index.html

<!DOCTYPE html>
<!--加上标头,xmlns:th=...-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/index.css">
    <script src="js/index.js"></script>
</head>
<body>
    <div id="div_container">
        <div id="div_fruit_list">
            <p>水果库存信息2</p>
            <form th:action="@{index}" method="post">
                <input type="hidden" name="oper" value="search">
                请输入查询关键字：<input type="text" name="keyword" th:value="${session.keyword}"/>
                <input type="submit" value="查询" class="btn">
            </form>
            <a th:href="@{add.html}">添加水果</a>
            <table id="tbl_fruit">
                <tr>
                    <th>名称1</th>
                    <th>单价</th>
                    <th>库存</th>
                    <th>操作</th>
                </tr>
                <!--使用分支判断-->
                <tr th:if="${#lists.isEmpty(session.fruitList)}">
                    <td colspan="4">对不起,库存为空！</td>
                </tr>

                <tr th:unless="${#lists.isEmpty(session.fruitList)}" th:each="fruit : ${session.fruitList}">
                    <!--链接的路径使用绝对路径,@{}从当前项目开始-->
                    <!--这里的friut.fid,是调用了fruit类的get方法-->
                    <td><a th:text="${fruit.fname}" th:href="@{edit.do(fid=${fruit.fid})}">苹果</a></td>
                    <td th:text="${fruit.price}">5</td>
                    <td th:text="${fruit.fcount}">20</td>
                    <td><div th:onclick="|delFruit(${fruit.fid})|">删除</div></td>
                </tr>
            </table>
            <div>
                <input type="button" value="首  页" class="btn" th:onclick="|page(1)|" th:disabled="${session.pageNo==1}"/>
                <input type="button" value="上一页" class="btn" th:onclick="|page(${session.pageNo-1})|" th:disabled="${session.pageNo==1}"/>
                <input type="button" value="下一页" class="btn" th:onclick="|page(${session.pageNo+1})|" th:disabled="${session.pageNo==session.pageCount}"/>
                <input type="button" value="尾  页" class="btn" th:onclick="|page(${session.pageCount})|" th:disabled="${session.pageNo==session.pageCount}"/>
            </div>
        </div>
    </div>
</body>
</html>

7.2 编写添加水果页面：add.html

页面这里写在web目录下。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--action中的add,到web.xml中匹配对应的servlet类.method这里用post,这样对应了doPost方法-->
<form action="add" method="post">
    <!--这里表单必须有name属性,这样servlet才能获取到信息-->
    名称：<input type="text" name="fname"/><br/>
    价格：<input type="text" name="price"/><br/>
    库存：<input type="text" name="fcount"/><br/>
    备注：<input type="text" name="remark"/><br/>
    <input type="submit" value="添加">
</form>
</body>
</html>

7.3 编写编辑水果页面：edit.html

<!DOCTYPE html>
<!--加上标头,xmlns:th=...-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
<div id="div_container">
    <div id="div_fruit_list">
        <p>编辑库存信息</p>
        <form th:action="@{update.do}" method="post">
            <table id="tbl_fruit" th:object="${fruit}">
                <tr>
                    <td><input type="hidden" name="fid" th:value="*{fid}"/></td>
                </tr>
                <tr>
                    <th>名称：</th>
                    <td><input type="text" name="fname" th:value="*{fname}"/></td>
                </tr>
                <tr>
                    <th>单价：</th>
                    <td><input type="text" name="price" th:value="*{price}"/></td>
                </tr>
                <tr>
                    <th>库存：</th>
                    <td><input type="text" name="fcount" th:value="*{fcount}"/></td>
                </tr>
                <tr>
                    <th>备注：</th>
                    <td><input type="text" name="remark" th:value="*{remark}"/></td>
                </tr>
                <tr>
                    <th colspan="2">
                        <input type="submit" value="修改"/>
                    </th>
                </tr>
            </table>
        </form>

    </div>
</div>
</body>
</html>

8. 根据需要编写css与js

css与js在web下都建立一个文件夹。

index.css

body{
    margin: 0;
    padding: 0;
}
div{
    position: relative;
    float: left;
}
#div_container{
    width: 80%;
    height: 100%;
    border: 1px solid blue;
    margin-left: 10%;
    float: left;
}
#tbl_fruit {
    width: 100%;
}
#tbl_fruit th,tr {
    width: 20%;
}

index.js

function delFruit(fid) {
    if (confirm("是否确认删除")) {
        window.location.href='del.do?fid='+fid;
    }
}

function page(pageNo) {
    window.location.href="index?pageNo="+pageNo;
}

9. 配置web.xml

配置好web.xml，让前端的请求可以发送给对应的servlet处理。

如果servlet加了注解，就不用配置web.xml了。

配置themeleaf的上下文。

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">

    <context-param>
        <param-name>view-prefix</param-name>
        <param-value>/</param-value>
    </context-param>
    <context-param>
        <param-name>view-suffix</param-name>
        <param-value>.html</param-value>
    </context-param>
</web-app>

10. 可能出现的问题

10.1 包找不到

这是由于后面加入的包并没有加到artifact中，点击File-Project Structure-Problems，添加包到artifact中即可。

标签：水果,String,管理系统,int,Connection,import,public,conn
From： https://www.cnblogs.com/run-around/p/16607194.html