java实战:jsp快速实现简单易用的信息登记与查询功能

一、先看效果

本篇主要用于介绍信息登记以及查询功能，介绍jsp的数据录入和查询实现。
信息登记页面图示：

管理人员查询页面图示：

二、数据库准备

创建一个专用数据库和两张表：

/*创建数据库*/
create database test;/*创建社区编码表*/
create table test_zone_info
(
province        varchar(50),
city            varchar(50),
street          varchar(100),
zone_name       varchar(100),
zone_id         varchar(100)
)insert test_zone_info
values('江苏','某地市','XX街道','XX小区','jsxx0001');/*创建个人信息采集表*/
create table test_code
(
user_name       varchar(20),
user_sex        varchar(10),
user_tel        varchar(12),
user_cert_no    varchar(30),
code_color      varchar(4),
user_addr       varchar(30),
user_track      varchar(2000),
user_remark     varchar(300),
input_time      datetime,
zone_id         varchar(100)
);/*统计脚本*/
select b.zone_name 小区或村组名称,a.user_name 姓名,a.user_sex 性别,a.user_tel 手机号,a.user_cert_no 身份证号,
a.code_color 码颜色,a.user_addr 住址,a.user_track 行踪轨迹,a.user_remark 备注
from test_code a,test_zone_info b
where a.zone_id=b.zone_id
order by input_time desc,a.user_addr

三、代码实现

信息录入填写页面：

<%@page language="java" import="java.util.*"contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 新 Bootstrap 核心 CSS 文件 --><link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><!-- jQuery文件。务必在bootstrap.min.js 之前引入 --><script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script><!-- 最新的 Bootstrap 核心 JavaScript 文件 --><script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script><title>信息登记表</title>
</head>
<body><div class="container"><!-- 标题 --><h3 style="text-align: center;color:#0000ff;">XX社区信息登记表</h3><!-- 填写表单区 --><form action="InputInfoDeal.jsp" method="post"><div class="form-group"><label for="name">*姓名</label><input type="text" class="form-control" name="name" placeholder="请输入姓名"></div><div class="form-group"><label for="name">*性别</label></br><label class="radio-inline"><input type="radio" name="sexs" id="sex1" value="男" checked>男</label><label class="radio-inline"><input type="radio" name="sexs" id="sex2" value="女">女</label></div><div class="form-group"><label for="name">*手机号</label><input type="text" class="form-control" name="tel" placeholder="请输入手机号"></div><div class="form-group"><label for="name">*身份证号</label><input type="text" class="form-control" name="cert_no" placeholder="请输入身份证号"></div><div class="form-group"><label for="name">*码颜色</label></br><label class="radio-inline"><input type="radio" name="colors" id="color1" value="绿码" checked>绿码</label><label class="radio-inline"><input type="radio" name="colors" id="color2" value="黄码">黄码</label><label class="radio-inline"><input type="radio" name="colors" id="color3" value="红码">红码</label></div><div class="form-group"><label for="name">*您的家庭地址</label><input type="text" class="form-control" name="address" placeholder="楼栋号-单元号-门牌号"></div><div class="form-group"><label for="name">*您的行踪</label><textarea class="form-control" name="track" rows="3"></textarea></div><div class="form-group"><label for="name">其它补充</label><input type="text" class="form-control" name="remark" placeholder=""></div><button type="submit" class="btn btn-primary btn-block">填好了，现在提交</button></br></br><input type="hidden" class="form-control" name="zoneid" hidden value=<%=request.getParameter("zone_id")%>></form></div></body>
</html>

信息录入处理功能页面：


<%@page language="java" import="java.util.*" import="java.sql.*"contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 新 Bootstrap 核心 CSS 文件 --><link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><!-- jQuery文件。务必在bootstrap.min.js 之前引入 --><script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script><!-- 最新的 Bootstrap 核心 JavaScript 文件 --><script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script><title>个人信息登记表</title>
</head>
<body><%request.setCharacterEncoding("UTF-8");int result = 0;String errorstr = "";//调用Class.forName()方法加载mysql驱动程序try {Class.forName("com.mysql.cj.jdbc.Driver");    //mysql 8.0.20}catch (ClassNotFoundException e){errorstr = errorstr + e.toString() + "</br>";}try {Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/fangyi?useSSL=false&serverTimezone=UTC", "username", "password");String sql = "insert into test_code (user_name,user_sex,user_tel,user_cert_no,code_color,user_addr,user_track,user_remark,input_time,zone_id) "+ "values (?,?,?,?,?,?,?,?,now(),?)";PreparedStatement stmt = conn.prepareStatement(sql);stmt.setString(1, request.getParameter("name"));stmt.setString(2, request.getParameter("sexs"));stmt.setString(3, request.getParameter("tel"));stmt.setString(4, request.getParameter("cert_no"));stmt.setString(5, request.getParameter("colors"));stmt.setString(6, request.getParameter("address"));stmt.setString(7, request.getParameter("track"));stmt.setString(8, request.getParameter("remark"));stmt.setString(9, request.getParameter("zoneid"));int row=stmt.executeUpdate();if(row>0){result = 1;}stmt.close();conn.close();}catch (SQLException e){errorstr = errorstr + e.toString();}
%><div class="container"><%if (result == 1){%><span style="font-size: 16px;color:#0000ff;padding-top: 20px;">录入成功，<a href="InputInfo.jsp?zone_id="<%=request.getParameter("zoneid")%>>点击这里继续录入</a></span><%}else{%><span style="font-size: 16px;color:#0000ff;">录入失败，原因：</br><%=errorstr%></span><%}%></div></body>
</html>

信息查询页面：


<%@page language="java" import="java.util.*" import="java.sql.*"contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 新 Bootstrap 核心 CSS 文件 --><link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><!-- jQuery文件。务必在bootstrap.min.js 之前引入 --><script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script><!-- 最新的 Bootstrap 核心 JavaScript 文件 --><script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script><title>信息查询</title>
</head>
<body><%request.setCharacterEncoding("UTF-8");int result = 0;String errorstr = "";//调用Class.forName()方法加载mysql驱动程序try {Class.forName("com.mysql.cj.jdbc.Driver");    //mysql 8.0.20}catch (ClassNotFoundException e){errorstr = errorstr + e.toString() + "</br>";}Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/fangyi?useSSL=false&serverTimezone=UTC", "username", "password");Statement st = conn.createStatement();String sql = "select b.zone_name 小区或村组名称,a.user_name 姓名,a.user_sex 性别,a.user_tel 手机号,a.user_cert_no 身份证号, " +"a.code_color 码颜色,a.user_addr 住址,a.user_track 行踪轨迹,a.user_remark 备注 " +"from test_code a,test_zone_info b " +"where a.zone_id=b.zone_id " +"order by input_time desc,a.user_addr ";ResultSet rs = st.executeQuery(sql);
%><div class="container"><table class="table table-bordered"><caption style="text-align: center;font-size: 18px;">已登记个人信息</caption><tr><td>小区或村组名称</td><td>姓名</td><td>性别</td><td>手机号</td><td>身份证号</td><td>码颜色</td><td>住址</td><td>行踪轨迹</td><td>备注</td></tr><%while (rs.next()) { %><tr><td><%=rs.getString("小区或村组名称") %></td><td><%=rs.getString("姓名") %></td><td><%=rs.getString("性别") %></td><td><%=rs.getString("手机号") %></td><td><%=rs.getString("身份证号") %></td><td><%=rs.getString("码颜色") %></td><td><%=rs.getString("住址") %></td><td><%=rs.getString("行踪轨迹") %></td><td><%=rs.getString("备注") %></td></tr><%}st.close();conn.close();%></table><%=errorstr%></div></body>
</html>

部署要点：
1、安装jdk并配置环境变量
2、安装tomcat并启动服务，
3、安装mysql数据库并启动服务
第1、2、3点在前面的文章中都有详细介绍，这里不再赘述
4、把上面新做的页面拷贝到tomcat指定的web应用目录，记得把jdbc等相关jar包放到web应用目录下WEB-INF/lib目录下，然后再重启一下tomcat服务，不然连mysql数据库会报错。目录结构如下图，我用的idea编辑器，*.iml和.idea目录是多余的，部署时可以删掉。

四、产品推广

信息录入页面url中的zone_id参数可自行定制，事先插入到表中，然后就可以为每个区域的录入网址生成一个专用的二维码，再做成一个宣传海报，简易的产品就出来了。在线生成二维码的网站很多，比如草料二维码https://cli.im/ ；兵贵神速，任何的商机都在一瞬间，就看谁能抓住先机，做的过程中再不断迭代功能。

java实战:jsp快速实现简单易用的信息登记与查询功能相关推荐

一款好用的磁力链接下载工具，qbittorren中文版简单易用，漂亮的外观，功能强大
qbittorren for mac一款好用的磁力链接下载工具,qbittorren中文版简单易用,漂亮的外观,功能强大.支持 Windows.Mac 和 Linux,且功能非常强大.qbittorr ...
java通讯框架_gim: 一个简单易用，稳定高效的及时通讯框架（java、android）
gim 一个简单易用,稳定高效的及时通讯框架(java) 简介: gim是基于高性能网络框架getty封装的,能简单上手,稳定高效的及时通讯框架 Getty:[https://github.com/g ...
【Java】Jsoup爬虫,一个简单获取京东商品信息的小Demo
简单记录 - Jsoup爬虫入门实战数据问题?数据库获取,消息队列中获取中,都可以成为数据源,爬虫! 爬取数据:(获取请求返回的页面信息,筛选出我们想要的数据就可以了!) 我们经常需要分析HTML网 ...
Java实战之管家婆记账系统（8）——添加账目界面及功能实现
本节概要本节将实现账目记录的添加. 前期准备在本节中实现记录的添加将用到分类信息的查询,所以在dao包下创建ClassificationDao.java类,代码如下: package Accoun ...
Java实战之亲戚关系计算器（JavaFX版）（2）——功能介绍
功能一:计算亲属关系称谓比如说:爸爸的爸爸的爸爸是曾祖父,在上面的文本域中显示关系链,而在下面的文本域中显示称谓,这就是计算亲属关系称谓的功能. 点击"父"按钮,在最上面的文本域 ...
Java实战之亲戚关系计算器（swing版）（2）——功能介绍
功能一:计算亲属关系称谓比如说:爸爸的爸爸的爸爸是曾祖父,在上面的文本域中显示关系链,而在下面的文本域中显示称谓,这就是计算亲属关系称谓的功能. 点击"父"按钮,在最上面的文本域 ...
上学易 APP - 小学信息平台,学区查询,幼升小,小学,学区,学校基础信息平台
第二款上线的App,陆续开发了二年时间... 主要功能是小学地图,学校信息及学区查询,大家多多支持! AppStore搜索"学区"即可下载以下是AppStore的简介 ----- ...
【项目实战】select+input实现下拉框左右选择+模糊查询功能
前言: 在项目中用遇到下拉框左右选择的需求,而easyui没有找到合适的插件,就想着用listbox来实现,但后来针对这个项目中没有想到合适的办法(ps:大家有了可以推荐哟),从网上看了一些demo, ...
开源丨CloudBase CMS 内容管理系统！简单易用企业内容管理流
背景云开发CloudBase CMS 是云开发推出的一站式云端内容管理系统,助力企业的数据运营管理工作. 开发者可以直接在云开发扩展能力中一键安装 CloudBase CMS,免费使用 CloudB ...