剩下代码编写

最新推荐文章于 2023-03-28 14:59:34 发布

Maroon 5327

最新推荐文章于 2023-03-28 14:59:34 发布

阅读量123

点赞数

分类专栏：人事管理系统文章标签：数据库 sql java 开发语言

本文链接：https://blog.csdn.net/qq_60590604/article/details/125252302

版权

人事管理系统专栏收录该内容

11 篇文章 0 订阅

订阅专栏

jsp前台编写 html

代码

在index.jsp里编写前台页面

<%@ page import="tools.JDBCUtiles" %>
<%@ page import="java.sql.Connection" %><%--
  Created by IntelliJ IDEA.
  User: hx
  Date: 2022/6/12
  Time: 20:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>$Title$</title>
    <style>
      table {
        width: 600px;
        margin: 0 auto;
      }

      table td {
        text-align: center;
      }

      table td, table th {
        border: 1px solid black;
      }

      .green {
        background-color: #04dc01;
      }
    </style>
    <script src="jquery-1.8.2.min.js"></script>
    <script>
      $(function () {
        $("body").css("backgroundColor","green")
      })
    </script>
  </head>
  <body>
  <%
    Connection connection = JDBCUtiles.getConnection();
    out.print(connection);
  %>
  <table cellspacing="0" border="1" width="600">
    <caption><h1>人员列表</h1></caption>
    <thead>
    <tr class="green">
      <th>编号</th>
      <th>姓名</th>
      <th>性别</th>
      <th>年龄</th>
      <th>等级</th>
      <th>部门</th>
      <th>操作</th>
    </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
      </tr>
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
      </tr>
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
      </tr>
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
      </tr>
    </tbody>
    <tfoot>
    <tr>
      <td colspan="7">
        <button class="addData">添加人员</button>
      </td>
    </tr>
    </tfoot>
  </table>

  </body>
</html>

效果

前台编写完毕

servlet编写/index的路径

创建servlet包

新建Index文件

package servlet;

import bean.PersonBean;
import service.impl.PersonServiceImpl;

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 java.io.IOException;
import java.util.List;

@WebServlet("/index")
public class Index extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //获取参数
        //让业务员干活，得到返回值
        PersonServiceImpl personService = new PersonServiceImpl();
        List<PersonBean> personBeanList = personService.getAll();
        personService.close();
        //处理返回值
        req.setAttribute("personBeanList",personBeanList);
        //返回内容
        req.getRequestDispatcher("index.jsp").forward(req,resp);
    }
}

编写完毕

jsp动态的填入数据

填入数据前先进行测试是否能拿到所有数据

<%
  PersonServiceImpl personService = new PersonServiceImpl();
  List<PersonBean> all = personService.getAll();
  out.print(all);
%>

结果

如果能正常拿到即可继续编写代码

使用<c:forEach></c:forEach>遍历

<c:forEach items="${requestScope.personBeanList}" var="personBean">
    <tr person_id="${personBean.id}">
        <td>${personBean.id}</td>
        <td>${personBean.name}</td>
        <td>${personBean.sex}</td>
        <td>${personBean.age}</td>
        <td>${personBean.rank}</td>
        <td>${personBean.department}</td>
        <td>
            <a href="javascript:;" class="del">删除</a>
        </td>
    </tr>
</c:forEach>

结果

数据查询完毕

给a链接设置点击事件可拿到信息id

点击删除按钮可弹出当前行的id

$(function () {
    // 改变颜色
    changeColor();
    // 给按钮绑定事件
    $("button.addData").click(add_click);
    // 点击删除a链接时
    $("a.del").click(delete_data);
});

function delete_data() {
    var $tr = $(this).parent().parent();
    var id = $tr.attr("person_id");
    alert(id + "ajax");
    $.ajax({
        url: "delete",
        type: "get",
        data: {"id": id},
        dataType: "json",
        success: function (result) {
            alert(result["msg"]);
        }
    });
    // 成功
    // {"status":1,"msg":"删除成功"}
    // 删除
    // 失败 {"status":0,"msg":"删除失败"}

编写完成

编写dao中删除的方法

在dao目录下的接口中定义一个删除的方法

package dao;

import bean.PersonBean;

import java.util.List;

public interface PersonDao {
    //显示所有
    List<PersonBean> select();

    //删除
    int delete(String id);
}

再到实现类里重写此方法

package dao.impl;

import bean.PersonBean;
import dao.PersonDao;
import tools.BaseDao;

import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

public class PersonDaoImpl extends BaseDao implements PersonDao {
    public PersonDaoImpl(Connection connection) {
        super(connection);
    }

    @Override
    public List<PersonBean> select() {
        //sql
        String sql = "SELECT * FROM person";
        //obj
        Object[] objects = {};
        //father
        ResultSet resultSet = commonQuery(sql, objects);
        //deal
        List<PersonBean> personBeanList = new ArrayList<>();
        while (true){
            try {
                if (!resultSet.next()) break;
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
            PersonBean personBean = lineToObject(resultSet);
            personBeanList.add(personBean);
        }
        return personBeanList;
    }

    @Override
    public int delete(String id) {
        // sql
        String sql = "DELETE FROM person WHERE id = ?";
        // obj
        Object[] objects = {id};
        // 调用父类的方法
        int i = commonUpdate(sql, objects);
        // deal
        // return
        return i;
    }

    @Override
    public PersonBean lineToObject(ResultSet resultSet) {
        //获取零散数据
        int id = 0;
        String name = null;
        String sex = null;
        int age = 0;
        String rank = null;
        String department = null;
        try {
            id = resultSet.getInt("id");
            name = resultSet.getString("name");
            sex = resultSet.getString("sex");
            age = resultSet.getInt("age");
            rank = resultSet.getString("rank");
            department = resultSet.getString("department");
        } catch (SQLException throwables) {
            throwables.printStackTrace();
        }
        //实例化一个bean对象
        PersonBean personBean = new PersonBean();
        //给对象赋值零散数据
        personBean.setId(id);
        personBean.setName(name);
        personBean.setSex(sex);
        personBean.setAge(age);
        personBean.setSex(rank);
        personBean.setDepartment(department);
        //返回
        return personBean;

    }
}

编写service中删除的方法

先在service的目录下的接口中定义删除方法

package service;

import bean.PersonBean;

import java.util.List;

public interface PersonService {
    //查询所有
    List<PersonBean> getAll();

    // 删除
    int delete(String id);
}

再到实现类里重写此方法

package service.impl;

import bean.PersonBean;
import dao.PersonDao;
import dao.impl.PersonDaoImpl;
import service.PersonService;
import tools.JDBCUtiles;

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

public class PersonServiceImpl implements PersonService {
    //连接对象
    private Connection connection;
    //人类dao
    private PersonDaoImpl personDao;
    public PersonServiceImpl() {
        //获得链接对象
        connection = JDBCUtiles.getConnection();
        //获得dao对象
        personDao = new PersonDaoImpl(connection);

    }

    //关闭
    public void close(){
        //关dao的资源
        this.personDao.close();
        //关连接对象
        JDBCUtiles.close(this.connection);
    }

    @Override
    public List<PersonBean> getAll() {
        return personDao.select();
    }

    @Override
    public int delete(String id) {
        return personDao.delete(id);
    }
}

在前端发ajax请求并处理返回

// 删除按钮的事件
function delete_data() {
    var $tr = $(this).parent().parent();
    var id = $tr.attr("person_id");
    alert(id + "ajax");
    $.ajax({
        url: "delete",
        type: "get",
        data: {"id": id},
        dataType: "json",
        success: function (result) {
            if (result["status"] === 1) {
                // 把tr删掉
                $tr.remove();
                // 隔行换色
                changeColor();
            }
            alert(result["msg"]);
        }
    });
    // 成功
    // {"status":1,"msg":"删除成功"}
    // 删除
    // 失败 {"status":0,"msg":"删除失败"}
}

编写jsp页当用户访问添加页时显示表单

$(function () {
    // 改变颜色
    changeColor();
    // 给按钮绑定事件
    $("button.addData").click(add_click);
    // 点击删除a链接时
    $("a.del").click(delete_data);
});

// 添加人员的按钮事件
function add_click() {
    window.location.href = "add";
}

当用户点击添加按钮是跳转到添加页面

新建一个add.jsp

前端页面

<form action="add" method="post">
        <table>
            <caption>添加人员</caption>
            <%--        (tr>td{$$}*2)*6--%>
            <tr>
                <td>
                    姓名
                </td>
                <td>
                    <input type="text" class="name" name="name">
                </td>
            </tr>
            <tr>
                <td>性别</td>
                <td>
                    <select name="sex" class="sex" id="">
                        <option value="-1">请选择</option>
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>年龄</td>
                <td>
                    <input type="text" name="age" class="age">
                </td>
            </tr>
            <tr>
                <td>等级</td>
                <td>
                    <select name="rank" class="rank" id="">
                        <option value="-1">请选择</option>
                        <option value="一级">一级</option>
                        <option value="二级">二级</option>

                    </select>
                </td>
            </tr>
            <tr>
                <td>部门</td>
                <td>
                    <select name="department" class="department" id="">
                        <option value="-1">请选择</option>
                        <option value="开发部">开发部</option>
                        <option value="支持部">支持部</option>
                        <option value="工程质量部">工程质量部</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="submit" value="提交">
                </td>
            </tr>
        </table>
    </form>
</body>

页面

编写dao中的添加方法形参是bean对象

package dao;

import bean.PersonBean;

import java.util.List;

public interface PersonDao {
    //显示所有
    List<PersonBean> select();

    //删除
    int delete(String id);

    // 添加
    int insert(PersonBean personBean);
}

先在dao目录下面的接口中定义添加方法以bean对象为形参

再到实现类中重写此方法

编写业务中的添加方法形参全是字符串不含id

在service目录下的接口中编写添加方法

再到实现类中重写此方法

编写servlet逻辑当用户访问add路径时显示表单

编写jsp页当用户访问添加页时显示表单

增强jsp页进行非空验证重名验证日期格式验证等

验证完毕

添加功能完成

Maroon 5327

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
剩下代码编写

代码在index.jsp里编写前台页面<%@ page import="tools.JDBCUtiles" %><%@ page import="java.sql.Connection" %><%-- Created by IntelliJ IDEA. User: hx Date: 2022/6/12 Time: 20:53 To change this template use File | Settings |
复制链接

扫一扫