简单实现前端jsp操作,对mysql进行增删改查

项目总结

该项目是一个基于 Java Web 技术栈的用户管理系统( uaer_sys ),采用经典的三层架构设计,主要功能围绕用户的增删改查操作展开。以下是项目的核心特点和技术栈总结:

  1. 技术架构
  • 后端框架 :使用 Java EE 技术,结合 Spring 框架(spring-beans、spring-core、spring-jdbc、spring-tx)进行开发
  • Web 层 :基于 Servlet 实现请求处理
  • 数据访问层 :使用 commons-dbutils 和 Druid 数据库连接池
  • 数据库 :MySQL(通过 druid.properties 配置)
  • 前端技术 :JSP + Bootstrap + jQuery
  1. 项目结构
  • 源代码组织 :采用标准的 Maven 目录结构,代码位于 src/com/demo/ 下,分为 dao (数据访问)、 entity (实体类)、 service (业务逻辑)、 utils (工具类)和 web (Web 层)等包
  • 配置文件 :包含数据库连接池配置( druid.properties )、Web 应用配置( web.xml )等
  • Web 资源 :JSP 页面、CSS、JavaScript 和字体文件等位于 web/ 目录下
  • 依赖库 :分为项目级依赖( lib/ )和 Web 应用依赖( web/WEB-INF/lib/ )
  1. 核心功能
    系统主要功能包括:
  • 用户登录认证( LoginServlet )
  • 用户信息列表展示( ListServlet )
  • 用户添加( AddServlet )
  • 用户更新( UpdateUserServlet )
  • 用户删除( DelServlet )
  • 验证码生成( CheckCodeServlet )
  1. 数据库配置
  • 数据库驱动: com.mysql.cj.jdbc.Driver
  • 数据库连接 URL: jdbc:mysql://localhost/test?useUnicode=true&characterEncoding=UTF-8
  • 用户名/密码: root / 1234
  • 连接池配置:初始连接数 5,最大活跃连接数 10,最大等待时间 3000ms
    ==============================================

后端代码:

JDBC工具类,使用Durid连接池


import com.alibaba.druid.pool.DruidDataSourceFactory;

import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.SQLException;
import java.util.Properties;

/**
 * JDBC工具类 使用Durid连接池
 */
public class JDBCUtils {

    private static DataSource ds ;
    static {
        try {
            //1.加载配置文件
            Properties pro = new Properties();
            //使用ClassLoader加载配置文件,获取字节输入流
            InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties");
            pro.load(is);
            //2.初始化连接池对象
            ds = DruidDataSourceFactory.createDataSource(pro);
        } catch (IOException e) {
            e.printStackTrace();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
    /**
     * 获取连接池对象
     */
    public static DataSource getDataSource(){
        return ds;
    }
    /**
     * 获取连接Connection对象
     */
    public static Connection getConnection() throws SQLException {
        return  ds.getConnection();
    }
}

实体类

/**
 * 登录表t_login的实体类
 */
public class Login {

    private Integer id;
    private String username;
    private String password;
    /* 忽略get set toString*/
}


public class User {

    private Integer id;//编号
    private String name;//姓名
    private String gender;//性别
    private Integer age;//年龄
    private String address;//地址
    private String qq;//qq号码
    private String email;//email地址
    /* 忽略get set toString*/
}

dao层

/**
 * 数据访问对象UserDao接口
 */

public interface UserDao {


    //通过用户名和密码验证用户是否合法
    public User checkUserByUsernameAndPassword(String username, String password) throws Exception;

    //查询所有用户信息
     public List<User> getUserList() throws Exception;

    //根据id查询单个用户信息
    public User getUserById(Integer id) throws Exception;

    //添加用户信息
    public int addUser(User user) throws  Exception;

    //修改用户信息
    public int updateUser(User user) throws  Exception;

    //根据id删除用户信息
    public int deleteUserById(String id) throws  Exception;


}


import com.demo.dao.UserDao;
import com.demo.entity.User;
import com.demo.utils.JDBCUtils;
import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanHandler;
import org.apache.commons.dbutils.handlers.BeanListHandler;

import java.util.List;

/**
 * dao的实现类
 */
public class UserDaoImpl implements UserDao {

    private final String CHECK_USER = "SELECT * FROM user WHERE USERNAME=? AND PASSWORD=?";
    private final String GET_USERLIST = "SELECT * FROM customer";
    private final String GET_USERBYID = "SELECT * FROM customer WHERE ID=?";
    private final String ADD_USER = "INSERT INTO customer(NAME,GENDER,AGE,ADDRESS,QQ,EMAIL) VALUES(?,?,?,?,?,?)";
    private final String UPDATE_USER = "UPDATE customer SET NAME=?,GENDER=?,AGE=?,ADDRESS=?,QQ=?,EMAIL=? WHERE ID=?";
    private final String DELETE_USERBYID = "DELETE FROM customer WHERE ID=?";

    //使用DBUtils工具类简化JDBC操作(借助数据源获取一个对象QueryRunner)
    private QueryRunner queryRunner = new QueryRunner(JDBCUtils.getDataSource());

    @Override
    public User checkUserByUsernameAndPassword(String username, String password) throws Exception {
        return queryRunner.query(CHECK_USER,new BeanHandler<User>(User.class),username,password);
    }

    @Override
    public List<User> getUserList() throws Exception {
        return  queryRunner.query(GET_USERLIST, new BeanListHandler<User>(User.class));
    }

    @Override
    public User getUserById(Integer id) throws Exception {
        return queryRunner.query(GET_USERBYID, new BeanHandler<User>(User.class), id);
    }

    @Override
    public int addUser(User user) throws Exception {
        return queryRunner.update(ADD_USER, user.getName(), user.getGender(), user.getAge(), user.getAddress(), user.getQq(), user.getEmail());
    }

    @Override
    public int updateUser(User user) throws Exception {
        return queryRunner.update(UPDATE_USER, user.getName(), user.getGender(), user.getAge(), user.getAddress(), user.getQq(), user.getEmail(),user.getId());
    }

    @Override
    public int deleteUserById(String id) throws Exception {
        return queryRunner.update(DELETE_USERBYID,id);
    }
}


service层

import com.demo.entity.User;

import java.util.List;

/**
 * 业务逻辑层service的接口
 */
public interface UserService {


    //通过用户名和密码验证用户是否合法
    public boolean checkUserByUsernameAndPassword(String username, String password) throws Exception;

    //查询所有用户信息
    public List<User> getUserList() throws Exception;

    //根据id查询单个用户信息
    public User getUserById(String id) throws Exception;

    //添加用户信息
    public boolean addUser(User user) throws  Exception;

    //修改用户信息
    public boolean updateUser(User user) throws  Exception;

    //根据id删除用户信息
    public boolean deleteUserById(String id) throws  Exception;
}

import com.demo.dao.UserDao;
import com.demo.dao.impl.UserDaoImpl;
import com.demo.entity.User;
import com.demo.service.UserService;

import java.util.List;

/**
 * 业务逻辑层service实现类
 */

public class UserServiceImpl implements UserService {

    //创建一个数据库访问对象的实例
    private UserDao userDao = new UserDaoImpl();

    @Override
    public boolean checkUserByUsernameAndPassword(String username, String password) throws Exception {
        return userDao.checkUserByUsernameAndPassword(username,password) !=null ? true : false;
    }

    @Override
    public List<User> getUserList() throws Exception {
        return userDao.getUserList();
    }

    @Override
    public User getUserById(String id) throws Exception {
        return userDao.getUserById(Integer.parseInt(id));
    }

    @Override
    public boolean addUser(User user) throws Exception {
        return userDao.addUser(user) > 0 ? true : false;
    }

    @Override
    public boolean updateUser(User user) throws Exception {
        return userDao.updateUser(user) > 0 ? true : false;
    }

    @Override
    public boolean deleteUserById(String id) throws Exception {
        return userDao.deleteUserById(id) > 0 ? true : false;
    }
}

web层

import com.demo.entity.User;
import com.demo.service.UserService;
import com.demo.service.impl.UserServiceImpl;
import org.apache.commons.beanutils.BeanUtils;

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.lang.reflect.InvocationTargetException;
import java.util.Map;

@WebServlet("/addServlet")
public class AddServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        try {
            //1、设置编码方式
            request.setCharacterEncoding("UTF-8");
            //2、获取参数
            Map<String, String[]> map = request.getParameterMap();
            //3、封装对象
            User user = new User();
            //4、拷贝数据   map   --->   user
            BeanUtils.populate(user, map);
            //5、调用service保存数据
            UserService userService = new UserServiceImpl();
            boolean flag = userService.addUser(user);
            //6、判断添加是否成功
            if(flag){
                //添加成功
                //跳转资源
                response.sendRedirect(request.getContextPath() + "/listServlet");
            }
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (InvocationTargetException e) {
            e.printStackTrace();
        } catch (Exception e) {
            e.printStackTrace();
        }


    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}


import javax.imageio.ImageIO;
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.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;

@WebServlet("/checkCodeServlet")
public class CheckCodeServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        int width = 100;
        int height = 50;
        //1、创建一个对象,用来生成验证码图片
        BufferedImage bufferedImage = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);

        //2、美化
        //2.1填充背景颜色
        Graphics graphics = bufferedImage.getGraphics();//画图对象
        graphics.setColor(Color.PINK);
        graphics.fillRect(0,0,width,height);

        //2.2画边框
        graphics.setColor(Color.BLUE);
        graphics.drawRect(0,0,width-1,height-1);

        //2.3实现验证码随机生成

        String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
        //随机生成角标
        Random random = new Random();
        //存储生成的验证码
        StringBuilder stringBuilder = new StringBuilder();
        for (int i = 1; i <=4 ; i++) {
            int index = random.nextInt(str.length());
            char c = str.charAt(index);
            stringBuilder.append(c);
            graphics.drawString(c+"",width/5 * i,height/2);
        }
        String checkCode_session = stringBuilder.toString();
        //存储验证码到session中
        HttpSession session = request.getSession();
        session.setAttribute("checkCode_session",checkCode_session);

        //2.4画干扰线
        graphics.setColor(Color.GREEN);
        for (int i = 0; i < 10 ; i++) {
            int x1 = random.nextInt(width);
            int x2 = random.nextInt(width);
            int y1 = random.nextInt(height);
            int y2 = random.nextInt(height);
            graphics.drawLine(x1,x2,y1,y2);
        }

        //3、输出验证码到浏览器
        ImageIO.write(bufferedImage,"jpg", response.getOutputStream());

    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
               this.doPost(request,response);
    }
}


import com.demo.service.UserService;
import com.demo.service.impl.UserServiceImpl;

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;

@WebServlet("delServlet")
public class DelServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String id = request.getParameter("id");
        UserService service = new UserServiceImpl();
        try {
            service.deleteUserById(id);
        }catch (Exception e){
            e.printStackTrace();
        }
        response.sendRedirect(request.getContextPath()+"listServlet");

    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
             doPost(request,response);
    }
}




import com.demo.entity.User;
import com.demo.service.UserService;
import com.demo.service.impl.UserServiceImpl;

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("/listServlet")
public class ListServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

            //创建一个UserService实例
        UserService userService = new UserServiceImpl();
        try {
            List<User> userList = userService.getUserList();
            //把userList传递给页面list.jsp进行显示
            request.setAttribute("userList",userList);
            //跳转资源
            request.getRequestDispatcher("/list.jsp").forward(request,response);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}



import com.demo.service.UserService;
import com.demo.service.impl.UserServiceImpl;

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;

@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1、设置request的编码方式
        request.setCharacterEncoding("utf-8");
        //2、获取参数
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        //用户输入的验证码
        String verifycode = request.getParameter("verifycode");
        //3、获取验证码
        HttpSession session = request.getSession();
        String checkCode_session = (String)session.getAttribute("checkCode_session");
        //移除验证码
        session.removeAttribute("checkCode_session");
        //4、判断用户输入的验证码和生成的验证码是否一致
        //判断输入的验证码不能为空
        if(verifycode != null && verifycode.equalsIgnoreCase(checkCode_session)){
            //验证码正确
            //判断用户名和密码发是否正确
            //1、创建UserService实例对象
            UserService userService = new UserServiceImpl();
            try {
                boolean flag = userService.checkUserByUsernameAndPassword(username,password);
                if(flag){
                    //用户合法
                    //存储用户信息到session中
                    session.setAttribute("username",username);
                    //跳转页面index.jsp
                     response.sendRedirect( request.getContextPath() + "/index.jsp");
                }else{
                    //非法用户
                    //用户名或者密码错误,给用户返回提示信息
                    request.setAttribute("msg_error","用户名或密码错误!");
                    //跳转页面(转发)
                    request.getRequestDispatcher("/login.jsp").forward(request,response);
                }

            } catch (Exception e) {
                e.printStackTrace();
            }
        }
        else{
            //验证码错误,给用户返回提示信息
            request.setAttribute("msg_error","验证码错误!");
            //跳转页面(转发)
            request.getRequestDispatcher("/login.jsp").forward(request,response);
        }
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}


import com.demo.entity.User;
import com.demo.service.UserService;
import com.demo.service.impl.UserServiceImpl;
import org.apache.commons.beanutils.BeanUtils;

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.lang.reflect.InvocationTargetException;
import java.util.Map;

@WebServlet("/updateUserServlet")
public class UpdateUserServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.设置编码
        request.setCharacterEncoding("utf-8");
        //2.获取map
        Map<String, String[]> map = request.getParameterMap();
        //3.封装对象
        User user = new User();
        try {
            BeanUtils.populate(user,map);
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (InvocationTargetException e) {
            e.printStackTrace();
        }

        //4.调用Service修改
        UserService service = new UserServiceImpl();
        try {
            service.updateUser(user);
        } catch (Exception e) {
            e.printStackTrace();
        }

        //5.跳转到查询所有Servlet
        response.sendRedirect(request.getContextPath()+"/listServlet");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}



properties配置文件

driverClassName=com.mysql.cj.jdbc.Driver
url=jdbc:mysql://localhost/test?useUnicode=true&amp;characterEncoding=UTF-8
username=root
password=1234
# 初始化连接数量
initialSize=5
# 最大连接数
maxActive=10
# 最大等待时间
maxWait=3000

前端jsp

<!-- add.jsp -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="zh-CN">
<head>
    <!-- 指定字符集 -->
    <meta charset="utf-8">
    <!-- 使用Edge最新的浏览器的渲染方式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- viewport视口:网页可以根据设置的宽度自动进行适配,在浏览器的内部虚拟一个容器,容器的宽度与设备的宽度相同。
    width: 默认宽度与设备的宽度相同
    initial-scale: 初始的缩放比,为1:1 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <title>添加用户</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- 2. jQuery导入,建议使用1.9以上的版本 -->
    <script src="js/jquery-2.1.0.min.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <center><h3>添加联系人页面</h3></center>
    <form action="${pageContext.request.contextPath}/addServlet" method="post">
        <div class="form-group">
            <label for="name">姓名:</label>
            <input type="text" class="form-control" id="name" name="name" placeholder="请输入姓名">
        </div>

        <div class="form-group">
            <label>性别:</label>
            <input type="radio" name="gender" value="" checked="checked"/><input type="radio" name="gender" value=""/></div>

        <div class="form-group">
            <label for="age">年龄:</label>
            <input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄">
        </div>

        <div class="form-group">
            <label for="address">籍贯:</label>
            <select name="address" class="form-control" id="address">
				<option value="河南">河南</option>
                <option value="广东">广东</option>
                <option value="广西">广西</option>
                <option value="湖南">湖南</option>
            </select>
        </div>

        <div class="form-group">
            <label for="qq">QQ:</label>
            <input type="text" class="form-control" name="qq" id="qq" placeholder="请输入QQ号码"/>
        </div>

        <div class="form-group">
            <label for="email">Email:</label>
            <input type="text" class="form-control" name="email" id="email" placeholder="请输入邮箱地址"/>
        </div>

        <div class="form-group" style="text-align: center">
            <input class="btn btn-primary" type="submit" value="提交" />
            <input class="btn btn-default" type="reset" value="重置" />
            <input class="btn btn-default" type="button" value="返回" />
        </div>
    </form>
</div>
</body>
</html>
<!-- index.jsp -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
  <head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>首页</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- 2. jQuery导入,建议使用1.9以上的版本 -->
    <script src="js/jquery-2.1.0.min.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">
    </script>
  </head>
  <body>
  <div align="center">
  	<a
	  href="${pageContext.request.contextPath}/listServlet" style="text-decoration:none;font-size:33px">查询所有用户信息
	</a>
  </div>
  </body>
</html>
<!-- list.jsp -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <!-- 指定字符集 -->
    <meta charset="utf-8">
    <!-- 使用Edge最新的浏览器的渲染方式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- viewport视口:网页可以根据设置的宽度自动进行适配,在浏览器的内部虚拟一个容器,容器的宽度与设备的宽度相同。
    width: 默认宽度与设备的宽度相同
    initial-scale: 初始的缩放比,为1:1 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <title>用户信息管理系统</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- 2. jQuery导入,建议使用1.9以上的版本 -->
    <script src="js/jquery-2.1.0.min.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
    <style type="text/css">
        td, th {
            text-align: center;
        }
    </style>
</head>
<body>
<div class="container">
    <h3 style="text-align: center">用户信息列表</h3>
    <table border="1" class="table table-bordered table-hover">
        <tr class="success">
            <th>编号</th>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
            <th>籍贯</th>
            <th>QQ</th>
            <th>邮箱</th>
            <th>操作</th>
        </tr>
        <c:forEach items="${userList}" var="list">
        <tr>
            <td>${list.id}</td>
            <td>${list.name}</td>
            <td>${list.gender}</td>
            <td>${list.age}</td>
            <td>${list.address}</td>
            <td>${list.qq}</td>
            <td>${list.email}</td>
            <td><a class="btn btn-default btn-sm" href="update.jsp">修改</a>&nbsp;<a class="btn btn-default btn-sm" href="">删除</a></td>
        </tr>
        </c:forEach>
        <tr>
            <td colspan="8" align="center"><a class="btn btn-primary" href="${pageContext.request.contextPath}/add.jsp">添加联系人</a></td>
        </tr>
    </table>
</div>
</body>
</html>

<!-- login.jsp -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
  <head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>管理员登录</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- 2. jQuery导入,建议使用1.9以上的版本 -->
    <script src="js/jquery-2.1.0.min.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">
		function refreshCode(){
			    //获取验证码的元素对象
			     var vcode = document.getElementById("vcode");
			     //设置验证码的src属性
                 vcode.src = "${pageContext.request.contextPath}/checkCodeServlet?" + new Date().getTime();
        }
    </script>
  </head>
  <body>
  	<div class="container" style="width: 400px;">
  		<h3 style="text-align: center;">管理员登录</h3>
        <form action="${pageContext.request.contextPath}/loginServlet" method="post">
	      <div class="form-group">
	        <label for="username">用户名:</label>
	        <input type="text" name="username" class="form-control" id="username" placeholder="请输入用户名"/>
	      </div>

	      <div class="form-group">
	        <label for="password">密码:</label>
	        <input type="password" name="password" class="form-control" id="password" placeholder="请输入密码"/>
	      </div>

	      <div class="form-inline">
	        <label for="vcode">验证码:</label>
	        <input type="text" name="verifycode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 120px;"/>
	        <a href="javascript:refreshCode()"><img src="${pageContext.request.contextPath}/checkCodeServlet" title="看不清点击刷新" id="vcode"/></a>
	      </div>
	      <hr/>
	      <div class="form-group" style="text-align: center;">
	        <input class="btn btn btn-primary" type="submit" value="登录">
	       </div>
	  	</form>

		<!-- 出错显示的信息框 -->
	  	<div class="alert alert-warning alert-dismissible" role="alert">
		  <button type="button" class="close" data-dismiss="alert" >
		  	<span>&times;</span></button>
		     <%--<strong>${msg_error}</strong>--%>
		</div>
  	</div>
  </body>
</html>

<!-- update.jsp -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <%--<base href="<%=basePath%>"/>--%>
    <!-- 指定字符集 -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>修改用户</title>

    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/jquery-2.1.0.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

</head>
<body>
<div class="container" style="width: 400px;">
    <h3 style="text-align: center;">修改联系人</h3>
    <form action="${pageContext.request.contextPath}/updateUserServlet" method="post">
        <input type="hidden" name="id" value="${user.id}">
        <div class="form-group">
            <label for="name">姓名:</label>
            <input type="text" class="form-control" id="name" name="name" value="${user.name}" readonly="readonly" placeholder="请输入姓名" />
        </div>

        <div class="form-group">
            <label>性别:</label>
            <c:if test="${user.gender ==''}">
                <input type="radio" name="gender" value="" checked /><input type="radio" name="gender" value=""  /></c:if>
            <c:if test="${user.gender ==''}">
                <input type="radio" name="gender" value=""  /><input type="radio" name="gender" value="" checked /></c:if>
        </div>

        <div class="form-group">
            <label for="age">年龄:</label>
            <input type="text" class="form-control" id="age"  name="age" value="${user.age}" placeholder="请输入年龄" />
        </div>

        <div class="form-group">
            <label for="address">籍贯:</label>
            <select name="address" id="address" class="form-control" >
                <c:if test="${user.address =='狭西'}">
                    <option value="狭西" selected>狭西</option>
                    <option value="河南">河南</option>
                    <option value="北京">北京</option>
                </c:if>
                <c:if test="${user.address =='河南'}">
                    <option value="狭西">狭西</option>
                    <option value="河南" selected>河南</option>
                    <option value="北京">北京</option>
                </c:if>
                <c:if test="${user.address =='北京'}">
                    <option value="狭西">狭西</option>
                    <option value="河南">河南</option>
                    <option value="北京" selected>北京</option>
                </c:if>
            </select>
        </div>

        <div class="form-group">
            <label for="qq">QQ:</label>
            <input type="text" class="form-control" id="qq" name="qq" value="${user.qq}" placeholder="请输入QQ号码"/>
        </div>

        <div class="form-group">
            <label for="email">Email:</label>
            <input type="text" class="form-control" id="email" name="email" value="${user.email}" placeholder="请输入邮箱地址"/>
        </div>

        <div class="form-group" style="text-align: center">
            <input class="btn btn-primary" type="submit" value="提交" />
            <input class="btn btn-default" type="reset" value="重置" />
            <input class="btn btn-default" type="button" value="返回"/>
        </div>
    </form>
</div>
</body>
</html>


用到的jar

javax.annotation.jar
javax.ejb.jar
javax.jms.jar
javax.persistence.jar
javax.resource.jar
javax.servlet.jar
javax.servlet.jsp.jar
javax.transaction.jar

c3p0-0.9.1.2.jar
commons-beanutils-1.8.3.jar
commons-dbutils-1.4.jar
commons-logging-1.1.1.jar
druid-1.0.9.jar
hamcrest-core-1.3.jar
javax.servlet.jsp.jstl.jar
jstl-impl.jar
junit-4.12.jar
mysql-connector-j-8.0.33.jar
mysql-connector-java-5.1.18-bin.jar
spring-beans-4.2.4.RELEASE.jar
spring-core-4.2.4.RELEASE.jar
spring-jdbc-4.2.4.RELEASE.jar
spring-tx-4.2.4.RELEASE.jar

Logo

汇聚全球AI编程工具,助力开发者即刻编程。

更多推荐