品牌数据管理（SSM + juqery + jsp + c标签库）

最新推荐文章于 2024-08-15 09:21:27 发布

咖啡Coffee~

最新推荐文章于 2024-08-15 09:21:27 发布

阅读量462

点赞数

分类专栏： SSM 文章标签： servlet mysql spring mybatis java

本文链接：https://blog.csdn.net/weixin_64144937/article/details/130901060

版权

SSM 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1.效果图：

先是数据的回显，再修改数据

上面已经把增删改演示完毕了，还有查询功能没有写，如果你感兴趣的话，可以把这个功能补全。

2.Jsp代码

brand.jsp

<%@ page import="java.util.List" %>
<%@ page import="cn.itaxu.pojo.Brand" %>
<%@ page import="java.util.ArrayList" %><%--
  Created by IntelliJ IDEA.
  User: 19578
  Date: 2022/11/4
  Time: 13:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>品牌数据</title>
    <script src="https://cdn.staticfile.org/jquery/3.6.1/jquery.js"></script>
    <style>
        .mask {
            display: none;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: rgba(0, 0, 0, .5);
        }

        .inner {
            width: 500px;
            height: 500px;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            background-color: #ffffff;
            border-radius: 20px;
        }

        #serialNum {
            margin-left: 32px;
        }

        #ordered {
            margin-left: 48px;
        }

        #description {
            margin-left: 80px;
        }

        .cd {
            margin: 30px 0 0 85px;
            width: 150px;
            height: 50px;
            display: flex;
            justify-content: space-between;
        }

        .info {
            margin-left: 90px;
        }

        .cd button, .cd input {
            width: 60px;
            cursor: pointer;
            border: none;
            outline: none;
            border-radius: 10px;
            background-color: rgba(0, 0, 0, .3);
        }

        input {
            outline: none;
        }

        .cd button:hover, .cd input:hover {
            color: #fff;
        }

        h2 {
            text-align: center;
        }

        .add {
            cursor: pointer;
        }

        #status {
            margin-left: 15px;
        }

        .status {
            margin-left: 30px;
        }

        .mask1 {
            display: none;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: rgba(0,0,0,.3);
        }

        .isDel {
            position: absolute;
            width: 260px;
            height: 82px;
            top: 25%;
            left: 50%;
            transform: translate(-50%);
            background-color: white;
            border-radius: 8px;
        }

        button {
            cursor: pointer;
        }
    </style>
</head>
<body>
<h1>${success}</h1>
<input type="button" value="新增" class="add"><br>
<div class="mask">
    <div class="inner">
        <h2>添加品牌</h2>
        <div class="info">
            <form action="/AddServlet" method="post">
                <label for="serialNum">序号：</label><input type="text" id="serialNum" name="id"><br>
                <label for="brandName">品牌名称：</label><input type="text" id="brandName" name="brandName"><br>
                <label for="companyName">企业名称：</label><input type="text" id="companyName" name="companyName"><br>
                <label for="ordered">排序</label><input type="text" id="ordered" name="ordered"><br>
                <label for="description">品牌介绍：<br></label><textarea name="description" id="description" cols="20"
                                                                    rows="5"></textarea><br>
                <label for="status" class="status">状态：</label>
                <input type="radio" name="status" id="status" value="0">禁用
                <input type="radio" name="status" value="1">启用
                <div class="cd">
                    <input type="submit" value="确定">
                    <button class="cancel">取消</button>
                </div>
            </form>
        </div>
    </div>
</div>
<hr>
<table border="1px solid #000" cellspacing="0" cellpadding="5px">
    <tr align="center">
        <th>序号</th>
        <th>品牌名称</th>
        <th>企业名称</th>
        <th>排序</th>
        <th>品牌介绍</th>
        <th>状态</th>
        <th>操作</th>
    </tr>

    <c:forEach items="${brands}" var="brand">
        <tr align="center">
            <td>${brand.getId()}</td>
            <td>${brand.getBrandName()}</td>
            <td>${brand.getCompanyName()}</td>
            <td>${brand.getOrdered()}</td>
            <td>${brand.getDescription()}</td>
            <td>${brand.getStatusStr()}</td>
            <td>
                <button><a href="/SelectByIdServlet?id=${brand.id}">修改</a></button>
                <button class="t"><a href="javascript:void(0)">删除</a></button>
                <div class="mask1">
                    <div class="isDel">
                        <div style="color: #000;font-weight: 700;position: absolute;left: 5%">提示</div>
                        <div style="position: absolute;left: 29%;top: 31%">
                            是否确认删除？<br>
                            <button class="cancel">取消</button>&nbsp;&nbsp;&nbsp;&nbsp;<button
                                class="del"><a href="/delete?id=${brand.id}">删除</a></button>
                        </div>
                    </div>
                </div>
            </td>
        </tr>
    </c:forEach>
</table>
<script>
    $(function () {
        $('.cd').on('click', 'button,input', function () {
            $('.mask').hide()
        });
        $('.add').on('click', function () {
            $('.mask').show()
        });
        $('.t').on('click', function () {
            $('.mask1').show();
        });
        $('.cancel').on('click', function () {
            $('.mask1').hide();
        });
        $('.del').on('click', function () {
            $('.mask1').hide();
        })
    })
</script>
</body>
</html>

update.jsp

<%--
  Created by IntelliJ IDEA.
  User: 19578
  Date: 2022/11/5
  Time: 9:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>修改品牌</title>
    <style>
        .mask{
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: rgba(0,0,0,.5);
        }
        .inner{
            width: 500px;
            height: 500px;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);
            background-color: #ffffff;
            border-radius: 20px;
        }
        #serialNum{
            margin-left: 32px;
        }
        #ordered{
            margin-left: 48px;
        }
        #description{
            margin-left: 80px;
        }
        .cd{
            margin: 30px 0 0 85px;
            width: 150px;
            height: 50px;
            display: flex;
            justify-content: space-between;
        }
        .info{
            margin-left: 90px;
        }
        .cd button,.cd input{
            width: 60px;
            cursor: pointer;
            border: none;
            outline: none;
            border-radius: 10px;
            background-color: rgba(0,0,0,.3);
        }
        input{
            outline: none;
        }
        .cd button:hover,.cd input:hover{
            color: #fff;
        }
        h2{
            text-align: center;
        }
        #status{
            margin-left: 15px;
        }
        .status{
            margin-left: 30px;
        }
        a{
            text-decoration: none;
            color: black;
        }
    </style>
</head>
<body>
<div class="mask">
    <div class="inner">
        <h2>修改品牌</h2>
        <div class="info">
            <form action="/UpdateServlet" method="post">
                <label for="serialNum">序号：</label><input type="text" id="serialNum" name="id" value="${brand.id}"><br>
                <label for="brandName">品牌名称：</label><input type="text" id="brandName" name="brandName"
                                                            value="${brand.brandName}"><br>
                <label for="companyName">企业名称：</label><input type="text" id="companyName" name="companyName"
                                                              value="${brand.companyName}"><br>
                <label for="ordered">排序</label><input type="text" id="ordered" name="ordered"
                                                       value="${brand.ordered}"><br>
                <label for="description">品牌介绍：<br></label><textarea name="description" id="description" cols="20"
                                                                     rows="5">${brand.description}</textarea><br>
                <label for="status" class="status">状态：</label>
                <c:if test="${brand.status == 0}">
                    <input type="radio" name="status" id="status" value="0" checked>禁用
                    <input type="radio" name="status" id="status" value="1">启用
                </c:if>

                <c:if test="${brand.status == 1}">
                    <input type="radio" name="status" id="status" value="0">禁用
                    <input type="radio" name="status" id="status" value="1" checked>启用
                </c:if>
                <div class="cd">
                    <input type="submit" value="确定">
                    <button class="cancel"><a href="/SelectAllServlet">取消</a></button>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>

3.后台代码

BrandMapper

public interface BrandMapper {

    /**
     * 查询所有
     * @return
     */
    List<Brand> selectAll();

    /**
     * 添加数据
     * @param brand
     * @return
     */
    void add(Brand brand);

    /**
     * 根据 id 查询
     * @param id
     * @return
     */
    Brand selectById(int id);

    /**
     * 更新数据
     * @param brand
     */
    void update(Brand brand);

    /**
     * 删除数据
     */
    int delete(Integer id);
}

BrandService

public class BrandService {
   SqlSessionFactory sqlSessionFactory = SqlSessionFactoryUtils.getSqlSessionFactory();

    /**
     * 查询所有
     * @return
     */
    public List<Brand> selectAll(){
        // 调用BrandMapper.selectAll()

        // 2.获取SqlSession
        SqlSession sqlSession = sqlSessionFactory.openSession();
        // 3.获取BrandMapper
        BrandMapper userMapper = sqlSession.getMapper(BrandMapper.class);
        // 4.调用方法
        List<Brand> brands = userMapper.selectAll();
        // 5.释放资源
        sqlSession.close();
        return brands;
    }

    /**
     * 添加品牌数据
     * @param brand
     */
    public void add(Brand brand){
        SqlSession sqlSession = sqlSessionFactory.openSession();
        BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
        mapper.add(brand);
        sqlSession.commit();
        sqlSession.close();
    }

    /**
     * 根据 id 查询
     * @param id
     * @return
     */
    public Brand selectById(int id){
        // 调用BrandMapper.selectAll()

        // 2.获取SqlSession
        SqlSession sqlSession = sqlSessionFactory.openSession();
        // 3.获取BrandMapper
        BrandMapper userMapper = sqlSession.getMapper(BrandMapper.class);
        // 4.调用方法
        Brand brand = userMapper.selectById(id);
        // 5.释放资源
        sqlSession.close();
        return brand;
    }

    public void update(Brand brand){
        SqlSession sqlSession = sqlSessionFactory.openSession();
        BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
        mapper.update(brand);
        sqlSession.commit();
        sqlSession.close();
    }

    public void delete(Integer id){
        SqlSession sqlSession = sqlSessionFactory.openSession();
        BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);
        mapper.delete(id);
        sqlSession.commit();
        sqlSession.close();;
    }

}

数据库连接的工具类

public class SqlSessionFactoryUtils {
    private static SqlSessionFactory sqlSessionFactory;

    // 静态代码块,在类被加载时加载,仅加载一次
    static {
        try {
            InputStream inputStream = Resources.getResourceAsStream("mybatis-config.xml");
            sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    public static SqlSessionFactory getSqlSessionFactory(){ return sqlSessionFactory; }

}

Mybatis-config.xml配置文件

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <!--类型别名-->
    <typeAliases>
        <package name="cn.itaxu.pojo"/>
    </typeAliases>

    <environments default="development">
        <environment id="development">
            <transactionManager type="JDBC"/>
            <dataSource type="POOLED">
                <property name="driver" value="com.mysql.cj.jdbc.Driver"/>
                <property name="url"
                          value="jdbc:mysql:///mydb?useSSL=false&amp;useServerPrepStmts=true&amp;useSSL=false&amp;useUnicode=true&amp;characterEncoding=utf-8&amp;serverTimezone=UTC"/>
                <property name="username" value="root"/>
                <property name="password" value="root"/>
            </dataSource>
        </environment>
    </environments>
    <mappers>
        <!--扫描mapper-->
        <package name="cn.itaxu.mapper"/>
    </mappers>
</configuration>

BrandMapper.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="cn.itaxu.mapper.BrandMapper">
    <delete id="delete" parameterType="int">
        delete from brand_test where id = #{id}
    </delete>
    <update id="update">
        update brand_test set id=#{id},brandName=#{brandName},companyName=#{companyName},ordered=#{ordered},description=#{description},status=#{status} where id=#{id}
    </update>
    <select id="selectById" resultType="cn.itaxu.pojo.Brand">
        select * from brand_test where id=#{id}
    </select>
    <insert id="add">
        insert into brand_test values(#{id},#{brandName},#{companyName},#{ordered},#{description},#{status})
    </insert>
    <select id="selectAll" resultType="cn.itaxu.pojo.Brand">
        select * from brand_test
    </select>
</mapper>