1.准备工作，首先要有一个数据库，在数据库里新建一个表，用来操作id要设置为自动增长列，否则在插入操作无法成功
在MyEclipse中新建一个Web Progect工程
在src目录下建立entity包，dao包
在WebRoot/WebInfo/lib/导入sqljdbc.jar包（用于对数据库进行操作）
2.entity包，用于操作数据库 （这部分用到的成员变量最好直接通过数据库来直接复制，以免存在漏泄，写错单词等低级错误，其他的就是简单的get和set方法了）
package entity;
public class UserInfo {
private int id;
private String user_name;
private String user_sex;
private int user_age;
private String user_hobby;
private String user_city;
private String mtext;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getUser_name() {
return user_name;
}
public void setUser_name(String user_name) {
this.user_name = user_name;
}
public String getUser_sex() {
return user_sex;
}
public void setUser_sex(String user_sex) {
this.user_sex = user_sex;
}
public int getUser_age() {
return user_age;
}
public void setUser_age(int user_age) {
this.user_age = user_age;
}
public String getUser_hobby() {
return user_hobby;
}
public void setUser_hobby(String user_hobby) {
this.user_hobby = user_hobby;
}
public String getUser_city() {
return user_city;
}
public void setUser_city(String user_city) {
this.user_city = user_city;
}
public String getMtext() {
return mtext;
}
public void setMtext(String mtext) {
this.mtext = mtext;
}
}
Dao包下用于对数据库的操作数据库
（1）
BaseDao.java链接数据库(其中的close方法中依次关闭了结果集，操作句柄，链接)
package dao;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
public class BaseDao {
public static Connection getConnection()throws Exception{
Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
String url="jdbc:sqlserver://127.0.0.1:1433;database=mydb";
return DriverManager.getConnection(url, "sa", "sa");
}
public static void close(ResultSet rs,Statement sta,Connection con)throws Exception{
if(rs!=null){
//关闭结果集
rs.close();
}
if(sta!=null){
//关闭操作句柄
sta.close();
}
if(con!=null){
//关闭链接
con.close();
}
}
}
是数据库的增删改查的方法
package dao;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import entity.UserInfo;
public class UserInfoDao {
//查询所有（查）
public ArrayList findAll(){
Connection con=null;
PreparedStatement psta=null;
ResultSet rs=null;
ArrayList list=new ArrayList();
String sql="select * from userinfo";
try{
con=BaseDao.getConnection();
psta=con.prepareStatement(sql);
rs=psta.executeQuery();
while(rs.next()){
UserInfo obj=new UserInfo();
obj.setId(rs.getInt(1));
obj.setUser_name(rs.getString(2));
obj.setUser_sex(rs.getString(3));
obj.setUser_age(rs.getInt(4));
obj.setUser_hobby(rs.getString(5));
obj.setUser_city(rs.getString(6));
obj.setMtext(rs.getString(7));
list.add(obj);
}
}catch(Exception e){
e.printStackTrace();
}finally{
try{
BaseDao.close(rs, psta, con);
}catch(Exception e){
e.printStackTrace();
}
return list;
}
}
//插入方法（增）
public boolean save(UserInfo obj){
Connection con=null;
PreparedStatement psta=null;
String sql="insert into userinfo values(?,?,?,?,?,?)";
boolean flag=false;
try{
con=BaseDao.getConnection();
psta=con.prepareStatement(sql);
psta.setString(1, obj.getUser_name());
psta.setString(2, obj.getUser_sex());
psta.setString(3, obj.getUser_age()+"");
psta.setString(4, obj.getUser_hobby());
psta.setString(5, obj.getUser_city());
psta.setString(6, obj.getMtext());
flag=psta.executeUpdate()>0;
}catch(Exception e){
e.printStackTrace();
}finally{
try{
BaseDao.close(null, psta, con);
}catch(Exception e){
e.printStackTrace();
}
return flag;
}
}
//删除方法（删）
public boolean remove(int id){
Connection con=null;
PreparedStatement psta=null;
boolean flag=false;
String sql="delete from userinfo where id=?";
try{
con=BaseDao.getConnection();
psta=con.prepareStatement(sql);
psta.setInt(1, id);
flag=psta.executeUpdate()>0;
}catch(Exception e){
e.printStackTrace();
}finally{
try{
BaseDao.close(null, psta, con);
}catch(Exception e){
e.printStackTrace();
}
return flag;
}
}
//通过id修改，为更新做准备的（改）
public UserInfo findById(int id){
Connection con=null;
PreparedStatement psta=null;
ResultSet rs=null;
UserInfo obj=null;
String sql="select * from userinfo where id=?";
try{
con=BaseDao.getConnection();
psta=con.prepareStatement(sql);
psta.setInt(1, id);
rs=psta.executeQuery();
if(rs.next()){
obj=new UserInfo();
obj.setId(rs.getInt(1));
obj.setUser_name(rs.getString(2));
obj.setUser_sex(rs.getString(3));
obj.setUser_age(rs.getInt(4));
obj.setUser_hobby(rs.getString(5));
obj.setUser_city(rs.getString(6));
obj.setMtext(rs.getString(7));
}
}catch(Exception e){
e.printStackTrace();
}finally{
try{
BaseDao.close(rs, psta, con);
}catch(Exception e){
e.printStackTrace();
}
return obj;
}
}
//更新方法（修改数据）（改）
public boolean update(UserInfo obj){
Connection con=null;
PreparedStatement psta=null;
String sql="update userinfo set user_name=?,user_sex=?,user_age=?,user_hobby=?,user_city=?,mtext=? where id=?";
boolean flag=false;
try{
con=BaseDao.getConnection();
psta=con.prepareStatement(sql);
psta.setString(1, obj.getUser_name());
psta.setString(2, obj.getUser_sex());
psta.setString(3, obj.getUser_age()+"");
psta.setString(4, obj.getUser_hobby());
psta.setString(5, obj.getUser_city());
psta.setString(6, obj.getMtext());
psta.setInt(7,obj.getId());
flag=psta.executeUpdate()>0;
}catch(Exception e){
e.printStackTrace();
}finally{
try{
BaseDao.close(null, psta, con);
}catch(Exception e){
e.printStackTrace();
}
return flag;
}
}
}
3.界面演示
查找界面
在WebRoot/WEB-INF下的index.jsp下设计要演示的界面
这里为了方便操作还增加了一些删除和修改的跳转链接（这部分是为了方便后续的删除和修改操作）
<pre name="code" class="javascript"><%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<html>
<head>
<title></title>
</head>
<%
UserInfoDao dao=new UserInfoDao();
ArrayList list=dao.findAll();
%>
<script type="text/javascript">
function myAction(pid){
document.forms[0].id.value=pid;
document.forms[0].submit();
}
</script>
<body>
<h1 align="center"><br></h1><h1 align="center"> 用户信息</h1>
<form action="doRemove.jsp" method="post">
<!-- 用于存放选择的id，然后会随表单提交给服务器处理页面 -->
<input type="hidden" name="id">
<table align="center" border="1" width="80%">
<tr>
<td colspan="8" align="right">
<a href="add.jsp">添加新信息</a>
</td>
</tr>
<tr>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>爱好</th>
<th>城市</th>
<th>描述</th>
<th>操作</th>
</tr>
<%for(int i=0;i<list.size();i++){
UserInfo obj=(UserInfo)list.get(i);%>
<!--Html代码-->
<tr>
<td><%=obj.getId()%></td>
<td><%=obj.getUser_name()%></td>
<td><%=obj.getUser_sex()%></td>
<td><%=obj.getUser_age()%></td>
<td><%=obj.getUser_hobby()%></td>
<td><%=obj.getUser_city()%></td>
<td><%=obj.getMtext()%></td>
<td>
<%-- <a href="doRemove.jsp?id=<%=obj.getId()%>">删除</a> --%>、
<a href="update.jsp?id=<%=obj.getId()%>">修改</a>
<input type="button" value="删除" οnclick="myAction('<%=obj.getId()%>')"/>
</td>
</tr>
<%}%>
</table>
</form>
</body>
<html>对于JSP onclick的方法中提交时可以用document.forms[0].name.value (name为表单的名字，这个表单中为id)
或者 document.表单名.控件名.value 提交的必须是<input/>中的
打开数据库，开启服务器后，在浏览器中键入地址后的界面如下
这样查询的操作就完成了
4.下面进行添加数据的操作
设计add.jsp提供数据添加的界面
<%@ page import="java.util.*" pageEncoding="UTF-8"%>
<html>
<head>
<title></title>
</head>
<!-- JavaScript是搭配HTML使用的脚本代码,可以帮助我们操作HTML内容和浏览器本身 -->
<!-- JavaScript可以做很多很多事情，甚至可以用来编写游戏和强大的基于浏览器的应用
然而更普遍的功能是利用JavaScript帮助我们进行表单验证,确保提交的数据是符合服务器业务处理要求的 -->
<script type="text/javascript">
function myBack(){
//将浏览器导航为index.jsp,location.href属性可以更改当前浏览器地址栏的内容
location.href="index.jsp";
//window.location.href="index.jsp";
}
//mySubmit方法用于提交表单，并且在提交之前验证表单数据的格式是否符合要求
function mySubmit(){
//先来个简单的,验证姓名必须有填写，不能为空
//首先获取姓名输入框的数据
//document是文档对象，代表整个HTML页面
//forms是表单集合，如果存在多个表单的话,索引从0开始，并且是从上往下编号 如果表单有表单名可以用<span style="font-family:FangSong_GB2312;"><strong>document.表单名.控件名.value </strong></span>
//user_name是表单下控件的名字
//value是获取这个控件的value值
//length是一个属性，返回长度
//var是变量，JavaScript是弱类型语言,也就是说不区分int,double,Object这些类型
//而是统一使用var表示
var name=document.forms[0].user_name;
//通过document.getElementById（“id名”） 可以获取非<input /> 中的内容，但是dojsp无法获取
var name_msg=document.getElementById("name_msg");
var hobby_msg=document.getElementById("hobby_msg");
name_msg.innerHTML="";
hobby_msg.innerHTML="";
if(name.value.length==0){
//提示用户
//alert("姓名为必填项");
name_msg.innerHTML="<font color='red'>*姓名为必填项</font>";
//聚焦（鼠标定位）
name.focus();
return ;//中断方法的运行
}
//对于多选的控件判断会稍微麻烦点点哦
var hobby_item=document.forms[0].user_hobby;
var flag=false;
for(var i=0;i<hobby_item.length;i++){
if(hobby_item[i].checked==true){
flag=true;
break;
}
}
if(flag==false){
//alert("至少选择一个爱好");
hobby_msg.innerHTML="<font color='red'>*至少选择一个爱好</font>";
return ;
}
document.forms[0].submit();//submit是提交方法
}
</script>
<body>
<h1 align="center">新增信息</h1>
<form action="doadd.jsp" method="post" >
<table align="center" width="50%">
<!-- 姓名 -->
<tr>
<td align="right" width="37%">姓名:</td>
<td align="left" width="25%"><input type="text" name="user_name" ></td>
<td>
<div id="name_msg" align="left"></div>
</td>
</tr>
<!-- 性别 -->
<tr>
<td align="right">性别:</td>
<td align="left" colspan="2"><input type="radio" name="user_sex" value="男" checked="checked">男
<input type="radio" name="user_sex" value="女" />女</td>
</tr>
<!-- 年龄 -->
<tr>
<td align="right">年龄:</td>
<td align="left" colspan="2"><select name="user_age">
<% for(int i=18;i<=30;i++){%>
<option value="<%=i%>" ><%=i%></option>
<%} %>
</select></td>
</tr>
<!-- 爱好 -->
<tr>
<td align="right">爱好:</td>
<td align="left"><input type="checkbox" name="user_hobby" value="唱歌"/>唱歌
<input type="checkbox" name="user_hobby" value="跳舞"/>跳舞
<input type="checkbox" name="user_hobby" value="阅读"/>阅读 </td>
<td>
<div id="hobby_msg"></div>
</td>
</tr>
<!-- 城市 -->
<tr>
<td align="right" valign="middle">城市:</td>
<td align="left" colspan="2"><select name="user_city" multiple="multiple" size="9 ">
<option value="北京">北京 </option>
<option value="南京">南京 </option>
<option value="成都">成都 </option>
<option value="杭州">杭州 </option>
<option value="深圳">深圳 </option>
<option value="西安">西安 </option>
<option value="长沙">长沙 </option>
<option value="武汉">武汉 </option>
<option value="上海">上海 </option>
</select></td>
</tr>
<!-- 描述 -->
<tr>
<td align="right" valign="middle">描述:</td>
<td align="left" colspan="2"><textarea rows="8" name="mtext"></textarea></td>
</tr>
<!-- 按钮 -->
<tr>
<td align="center" colspan="3">
<input type="button" value="添加" οnclick="mySubmit()">
<input type="button" value="返回" οnclick="myBack()">
</td>
</tr>
</table>
</form>
</body>
</html>这个界面要将新添加的信息发送给doadd.jsp页面，因此表单中要有post方式
界面如下
而doadd.jsp 是处理操作的页面，并非用于显示数据,所以无需任何HTML代码，只是将上一个add.jsp传递过来的数据进行处理，不用于在浏览器上显示出来
<%@ page import="java.util.*,entity.*,dao.*" pageEncoding="UTF-8"%>
<!-- 处理操作的页面，并非用于显示数据,所以无需任何HTML代码 -->
<%
//接收数据,在JSP中每个页面都具备一个隐藏的对象,这个对象包含着所有提交的请求信息
//这就是request对象，也成为请求对象
//request是一个隐式对象，所谓的隐式对象是无需声明直接使用的对象(事实上声明是存在的，不过不由我们来做)
//getParameter是request中最常见的方法，作用是根据传入的name获取value
//setCharacterEncoding是设置请求对象中参数的编码,必须在调用getParameter之前调用该方法
//并且一般来说这里的编码要和提交页面的编码一致
request.setCharacterEncoding("UTF-8");
String user_name=request.getParameter("user_name");
String user_sex=request.getParameter("user_sex");
String user_age=request.getParameter("user_age");
//getParameterValues可以获取name对应的一组value(如果name下有多个value被提交的话)
String[] s1=request.getParameterValues("user_hobby");
StringBuffer user_hobby=new StringBuffer();
for(int i=0;s1!=null&&i<s1.length;i++){
user_hobby.append(s1[i]);
if(i<s1.length-1){
user_hobby.append(",");
}
}
String[] s2=request.getParameterValues("user_city");
StringBuffer user_city=new StringBuffer();
for(int i=0;s2!=null&&i<s2.length;i++){
user_city.append(s2[i]);
if(i<s2.length-1){
user_city.append(",");
}
}
String mtext=request.getParameter("mtext");
UserInfo obj=new UserInfo();
obj.setUser_name(user_name);
obj.setUser_sex(user_sex);
obj.setUser_age(Integer.parseInt(user_age));
obj.setUser_hobby(user_hobby.toString());
obj.setUser_city(user_city.toString());
obj.setMtext(mtext);
UserInfoDao dao=new UserInfoDao();
dao.save(obj);
//除了request外,还有个隐藏的对象叫response
//response也是隐式对象，无需声明就可以直接使用
//和request不同的地方在于,它是表示响应
//现在我们要做的时候结束完所有工作后，页面重新为index.jsp
//所以需要通过响应对象将index.jsp页面响应回客户浏览器，否则客户浏览器得到的是doadd.jsp的页面代码
//换句话说就是空无一物
response.sendRedirect("index.jsp");
%>接下来进行删除操作
doRemove.jsp
<%@ page import="java.util.*,dao.*" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");
UserInfoDao dao=new UserInfoDao();
int id=Integer.parseInt(request.getParameter("id"));
String msg="操作出问题了,请稍后重试,或联系管理员";
if(dao.remove(id)){
msg="恭喜你,操作成功,成功删除id为"+id+"的数据";
}
//response.sendRedirect是重定向
//重定向会让我们的浏览器显示指定的页面,但是对于用户来说无法得知操作是否成功(只能通过查看显示的页面效果来判断)
//除了重定向以外还有3种提示效果
/
//1.弹出对话框,等待用户确认消息后再继续前往下一个页面
//2.显示信息,在一段时间后自动前往下一个页面
//response.sendRedirect("index.jsp");
%>
<%--
<script type="text/javascript">
alert("<%=msg%>");
location.href="index.jsp";
</script>
--%>
<%--
JSP是一个多种代码混杂的编写环境,其中包括的代码可以分为服务器端代码和客户端代码
所谓的服务器端代码是指运行在服务器环境中,由服务器负责解析和执行的代码,在JSP中Java代码就是服务器端代码
而其他的HTML,JS,CSS等代码都是客户端代码,是由浏览器来解析和执行
从请求响应模式的流程来说，是先执行服务器代码,然后执行客户端代码
在这个执行过程中不会去考虑混杂在一起后的先后顺序问题
简单的说,就是执行Java代码的时候,HTML,JS等代码是完全忽略的
而执行HTML,JS等代码的时候,Java代码早已执行完毕，所有Java代码的地方已经变成运行后的结果
--%>
<%//response.sendRedirect("index.jsp"); %>
<!-- 2.显示信息,在一段时间后自动前往下一个页面 -->
<%--
<html>
<head>
<meta http-equiv="refresh" content="5;index.jsp">
</head>
</html>
<h1><%=msg%>,5秒后返回首页,如浏览器无反应,<a href="index.jsp">请点击</a></h1>
--%>
<div id="msg"><h1><%=msg%>,5秒后返回首页,如浏览器无反应,<a href="index.jsp">请点击</a></h1></div>
<script type="text/javascript">
var count=4;
window.setInterval(function(){
if(count==0){
location.href="index.jsp";
}
var div_msg=document.getElementById("msg");
div_msg.innerHTML="<h1><%=msg%>,"+count+"秒后返回首页,如浏览器无反应,<a href='index.jsp'>请点击</a></h1>"
count--;
}, 1000);
</script>
<%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");
int id=Integer.parseInt(request.getParameter("id"));
UserInfoDao dao=new UserInfoDao();
UserInfo obj=dao.findById(id);
//准备好常量
ArrayList sexs=new ArrayList();
sexs.add("男");
sexs.add("女");
ArrayList hobbys=new ArrayList();
hobbys.add("唱歌");
hobbys.add("跳舞");
hobbys.add("阅读");
ArrayList citys=new ArrayList();
citys.add("北京");
citys.add("南京");
citys.add("成都");
citys.add("杭州");
citys.add("深圳");
citys.add("西安");
citys.add("长沙");
citys.add("武汉");
citys.add("上海");
%>
<html>
<head>
<title></title>
</head>
<script type="text/javascript">
function myBack(){
location.href="index.jsp";
}
function mySubmit(){
var name=document.forms[0].user_name;
var name_msg=document.getElementById("name_msg");
var hobby_msg=document.getElementById("hobby_msg");
name_msg.innerHTML="";
hobby_msg.innerHTML="";
if(name.value.length==0){
name_msg.innerHTML="<font color='red'>*姓名为必填项</font>";
name.focus();
return ;
}
var hobby_item=document.forms[0].user_hobby;
var flag=false;
for(var i=0;i<hobby_item.length;i++){
if(hobby_item[i].checked==true){
flag=true;
break;
}
}
if(flag==false){
hobby_msg.innerHTML="<font color='red'>*至少选择一个爱好</font>";
return ;
}
document.forms[0].submit();
}
</script>
<body>
<h1 align="center">修改信息</h1>
<form action="doUpdate.jsp" method="post" >
<input type="hidden" name="id" value="<%=obj.getId()%>">
<table align="center" width="50%">
<!-- 姓名 -->
<tr>
<td align="right" width="37%">姓名:</td>
<td align="left" width="25%"><input type="text" name="user_name" value="<%=obj.getUser_name()%>" ></td>
<td>
<div id="name_msg" align="left"></div>
</td>
</tr>
<!-- 性别 -->
<tr>
<td align="right">性别:</td>
<td align="left" colspan="2">
<%for(int i=0;i<sexs.size();i++){%>
<input type="radio" name="user_sex" value="<%=sexs.get(i).toString()%>"
<%if(obj.getUser_sex().equalsIgnoreCase(sexs.get(i).toString())){%>
checked="checked"
<% } %>
/><%=sexs.get(i).toString()%>
<% } %>
</td>
</tr>
<!-- 年龄 -->
<tr>
<td align="right">年龄:</td>
<td align="left" colspan="2"><select name="user_age">
<% for(int i=18;i<=30;i++){%>
<option value="<%=i%>" <%if(obj.getUser_age()==i){out.print("selected='selected'");} %>><%=i%></option>
<%} %>
</select></td>
</tr>
<!-- 爱好 -->
<tr>
<td align="right">爱好:</td>
<td align="left">
<%for(int i=0;i<hobbys.size();i++){%>
<input type="checkbox" name="user_hobby" value="<%=hobbys.get(i).toString()%>"<%if(obj.getUser_hobby().indexOf(hobbys.get(i).toString())!=-1){%>checked="checked"<%}%>/><%=hobbys.get(i).toString()%><% } %>
</td>
<td>
<div id="hobby_msg"></div>
</td>
</tr>
<!-- 城市 -->
<tr>
<td align="right" valign="middle">城市:</td>
<td align="left" colspan="2"><select name="user_city" multiple="multiple" size="9 ">
<%for(int i=0;i<citys.size();i++){%>
<option value="<%=citys.get(i).toString()%>" <%if(obj.getUser_city().indexOf(citys.get(i).toString())!=-1){%>selected="selected"<%} %>><%=citys.get(i).toString()%> </option>
<%} %>
</select></td>
</tr>
<!-- 描述 -->
<tr>
<td align="right" valign="middle">描述:</td>
<td align="left" colspan="2"><textarea rows="8" name="mtext"><%=obj.getMtext()%></textarea></td>
</tr>
<!-- 按钮 -->
<tr>
<td align="center" colspan="3">
<input type="button" value="修改" οnclick="mySubmit()">
<input type="button" value="返回" οnclick="myBack()">
</td>
</tr>
</table>
</form>
</body>
</html>doUpdate.jsp
<%@ page import="java.util.*,dao.*,entity.*" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");
String user_name=request.getParameter("user_name");
String user_sex=request.getParameter("user_sex");
String user_age=request.getParameter("user_age");
//如果多选控件没有选定值的话，返回是null而非长度为0的数组
String[] hobbys=request.getParameterValues("user_hobby");
StringBuffer user_hobby=new StringBuffer();
for(int i=0;hobbys!=null&&i<hobbys.length;i++){
user_hobby.append(hobbys[i]);
if(i<hobbys.length-1){
user_hobby.append(",");
}
}
String[] citys=request.getParameterValues("user_city");
StringBuffer user_city=new StringBuffer();
for(int i=0;citys!=null&&i<citys.length;i++){
user_city.append(citys[i]);
if(i<citys.length-1){
user_city.append(",");
}
}
String mtext=request.getParameter("mtext");
int id=Integer.parseInt(request.getParameter("id"));
UserInfo obj=new UserInfo();
obj.setId(id);
obj.setUser_name(user_name);
obj.setUser_sex(user_sex);
obj.setUser_age(Integer.parseInt(user_age));
obj.setUser_hobby(user_hobby.toString());
obj.setUser_city(user_city.toString());
obj.setMtext(mtext);
UserInfoDao dao=new UserInfoDao();
dao.update(obj);
response.sendRedirect("index.jsp");
%>
479
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
