jsp+jdbc實現增加僱員和分頁模糊查詢

前提是MySQL數據庫有一個emp僱員表,數據最好在10條以上,以便看到分頁結果

效果圖如下: 

 

 

 代碼還是有點小瑕疵,關於增加僱員,返回false結果時,跳轉不到失敗頁面

  • page.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.sql.*" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<%
        String path = request.getContextPath();
        String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    <meta http-equiv="Content-Type" content="text/html; charset='UTF-8'" />
    <base href="<%=basePath%>">
    <title>僱員查詢</title>
</head>
<%
    request.setCharacterEncoding("UTF-8");
%>
<body>
<%!//設置連接數據庫的參數
    private static final String DBDRIVER = "com.mysql.cj.jdbc.Driver";
    private static final String DBURL = "jdbc:mysql://localhost:3306/emp?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8&useSSL=false";
    private static final String DBUSER = "root";
    private static final String DBPASSWORD = "123456";
%>

<%
    String url = "page.jsp";
    int currentPage = 1;
    String keyWord = "";//默認的關鍵字
    int lineSize = 5;//每頁顯示的數據數
    int allRecorders = 0;//保存總記錄數
    String column = "empno";//定義默認的查詢列
    String columnData = "僱員編號:empno|僱員姓名:ename|僱員工作:job";//可操作的查詢列

    Connection conn = null;
    PreparedStatement pstmt = null;
    ResultSet rs = null;
%>

<%
    try{//如果沒有輸入參數那麼就會是null,null無法變爲數字
        currentPage = Integer.parseInt(request.getParameter("cp"));
    }catch(Exception e){}
    try{//如果沒有輸入參數那麼就會是null,null無法變爲數字
        lineSize = Integer.parseInt(request.getParameter("ls"));
    }catch(Exception e){}
    if(request.getParameter("kw")!=null){//表示有查詢的關鍵字
        keyWord = new String(request.getParameter("kw").getBytes("UTF-8"), "UTF-8");//將取得的關鍵字進行轉換
    }
    if(request.getParameter("col")!=null){//表示有查詢的檢索列
        column = request.getParameter("col");
    }
%>

<%//查詢總記錄數
    String sql = " SELECT COUNT(*) FROM emp WHERE "+column+" LIKE ? ";
    Class.forName(DBDRIVER);//加載數據庫驅動
    conn = DriverManager.getConnection(DBURL,DBUSER,DBPASSWORD);//設置數據庫連接
    pstmt = conn.prepareStatement(sql);
    pstmt.setString(1,"%"+keyWord+"%");
    rs = pstmt.executeQuery();//將查詢的結果返回
    if (rs.next()){
        allRecorders = rs.getInt(1);//返回總記錄數
    }
%>

<%//模糊查找數據
    sql = " SELECT empno,ename,job,hiredate,sal,comm " +
            " FROM emp " +
            " WHERE "+ column +"  LIKE ? LIMIT ?,? ";
    pstmt = conn.prepareStatement(sql);
    pstmt.setString(1,"%"+keyWord+"%");// 模糊查詢  %關鍵詞%
    pstmt.setInt(2,(currentPage-1)*lineSize);//(當前所在的頁 - 1) * 每頁顯示數據行數 0 5
    pstmt.setInt(3,lineSize);//每頁最多顯示數據行數 5 5
    rs = pstmt.executeQuery();
%>

<%--搜索欄--%>
<div id="spiltSearchDiv">
    <jsp:include page="split_page_search.jsp">
        <jsp:param name="columnData" value="<%=columnData%>"></jsp:param>
        <jsp:param name="keyWord" value="<%=keyWord%>"></jsp:param>
        <jsp:param name="allRecorders" value="<%=allRecorders%>"></jsp:param>
        <jsp:param name="column" value="<%=column%>"></jsp:param>
    </jsp:include>
</div>

<%--數據顯示欄--%>
<div id="dataDiv">
    <table border="1" width="70%" bgcolor="#F2F2F2">
        <tr>
            <td>僱員編號</td>
            <td>僱員姓名</td>
            <td>僱員工作</td>
            <td>僱傭日期</td>
            <td>僱員工資</td>
            <td>僱員獎金</td>
        </tr>
        <%
            while (rs.next()){       
                int empno = rs.getInt(1);
    			String ename = rs.getString(2);
    			String job = rs.getString(3);
    			Date hiredate = rs.getDate(4);
    			double sal = rs.getDouble(5);
    			double comm = rs.getDouble(6);
        %>
            <tr>
                <td><%=empno%></td>
				<td><%=ename%></td>
				<td><%=job%></td>
				<td><%=hiredate%></td>
				<td><%=sal%></td>
				<td><%=comm%></td>
            </tr>
        <%
            }
            conn.close();
        %>
    </table>
</div>

<%--分頁欄--%>
<div id="splitBarDiv">
    <jsp:include page="split_page_bar.jsp">
        <jsp:param name="currentPage" value="<%=currentPage%>"></jsp:param>
        <jsp:param name="lineSize" value="<%=lineSize%>"></jsp:param>
        <jsp:param name="column" value="<%=column%>"></jsp:param>
        <jsp:param name="keyWord" value="<%=keyWord%>"></jsp:param>
        <jsp:param name="allRecorders" value="<%=allRecorders%>"></jsp:param>
        <jsp:param name="url" value="<%=url%>"></jsp:param>
    </jsp:include>
</div>
</body>
</html>
  •  split_page_bar.jsp
<%@ page pageEncoding="UTF-8"%>
<%
    request.setCharacterEncoding("UTF-8");
%>

<%//設置由外部接收的數據
    String url = null;
    int currentPage = 1;//當前頁
    int lineSize = 5;//每頁數據數
    String column = null;//檢索列
    String keyWord = null;//關鍵詞
    int allRecorders = 0;//總記錄數
    int pageSize = 0 ;//總頁數
    int lsData [] = new int [] {1,5,10,15,20,30,50,100} ;//每頁顯示多少條數據
%>

<%//接收外部傳遞的參數
    try {
        currentPage = Integer.parseInt(request.getParameter("currentPage"));
    } catch (Exception e) {}
    try {
        allRecorders = Integer.parseInt(request.getParameter("allRecorders"));
    } catch (Exception e) {}
    try {
        lineSize = Integer.parseInt(request.getParameter("lineSize"));
    } catch (Exception e) {}
    column = request.getParameter("column") ;
    keyWord = request.getParameter("keyWord") ;
    url = request.getParameter("url") ;
%>

<%//計算總頁數
    if (allRecorders > 0) {
        pageSize = (allRecorders + lineSize - 1) / lineSize ;
    } else {    // 沒有記錄
        pageSize = 1 ;
    }
%>

<script type="text/javascript">
    function goSplit(vcp) { // 根據外部傳遞的cp內容進行操作
        var eleLs = document.getElementById("lsSel").value ;
        try {
            var eleKw = document.getElementById("kw").value ;
            var eleCol = document.getElementById("colSel").value ;
            window.location = "<%=url%>?cp=" + vcp + "&ls=" + eleLs + "&kw=" + encodeURIComponent(eleKw) + "&col=" + eleCol  ;
        } catch (Exception) {//如果出現異常,說明沒有關鍵字和檢索列
            window.location = "<%=url%>?cp=" + vcp + "&ls=" + eleLs  ;
        }
    }
</script>

    <input type="button" class="btn btn-default" value="首頁" onclick="goSplit(1)" <%=currentPage == 1 ? "disabled" : ""%>>
    <input type="button" class="btn btn-default" value="上一頁" onclick="goSplit(<%=currentPage-1%>)" <%=currentPage == 1 ? "disabled" : ""%>>
    <input type="button" class="btn btn-default" value="下一頁" onclick="goSplit(<%=currentPage+1%>)" <%=currentPage == pageSize ? "disabled" : ""%>>
    <input type="button" class="btn btn-default" value="尾頁" onclick="goSplit(<%=pageSize%>)" <%=currentPage == pageSize ? "disabled" : ""%>>
    <%--//添加一個下拉列表框--%>
	&nbsp;&nbsp;跳轉到:<select id="cpSel" onchange="goSplit(this.value)">
    <%--動態控制的option--%>
    <%
        for (int x = 1;x <= pageSize;x++){
    %>
    <option value="<%=x%>" <%=currentPage == x ? "selected" : ""%>><%=x%></option>
    <%
        }
    %>
</select>頁&nbsp;&nbsp;每頁顯示:
    <select id="lsSel" onchange="goSplit(1)">
        <%
            for (int x = 0 ; x<lsData.length ;x++){
        %>
        <option value="<%=lsData[x]%>" <%=lineSize == lsData[x] ? "selected" : ""%>><%=lsData[x]%></option>
        <%
            }
        %>
    </select>
    行記錄
  •  split_page_search.jsp
<%@ page pageEncoding="UTF-8"%>
<%
    request.setCharacterEncoding("UTF-8");
%>
<%
    String columnData = null;//查詢的數據列
    String keyWord = null;//查詢的關鍵字
    String column = null;//查詢的
    int allRecorders = 0;//查詢的總數據量
%>
<%//接收頁面的接收列
    try{
        allRecorders = Integer.parseInt(request.getParameter("allRecorders"));
    }catch (Exception e){}
    columnData = request.getParameter("columnData");
    keyWord = request.getParameter("keyWord");
    column = request.getParameter("column");
%>
請輸入查詢關鍵字:
<%
    if (columnData!=null){
%>
<select id="colSel">
    <%
        String result[] = columnData.split("\\|");
        for (int x = 0 ; x < result.length ; x ++){
            String temp[] = result[x].split(":");
    %>
        <option value="<%=temp[1]%>" <%=column.equals(temp[1])?"selected":""%>><%=temp[0]%></option>
    <%
        }
    %>
</select>
<%
    }
%>
<input type="text" name="kw" id="kw" value="<%=keyWord%>">

<input type="button" value="查詢" onclick="goSplit(1)">
<input type="button" value="增加僱員" onclick="javascript:window.location.href='add.html'">
<br>
<span>一共查詢到<%=allRecorders%>條記錄</span><br>
<%--,一共有<%=pageSize%>頁。--%>
  •  add.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>僱員註冊表單</title>
<script type="text/javascript">
	function Emp(){
		return Check();
	}
	
	function Check(){
		
		if(document.getElementById('empno').value.length==0)
	    {
			alert("編號不能爲空!");
			document.getElementById('wrong1').style.display = "block";
		    document.getElementById('empno').focus();
		    return false;
	    }
	    var value = document.getElementById("empno").value;
	    var reg=/^[1-9]\d*$|^0$/;   
	    if(reg.test(value)!=true)
	    {
	    	alert("編號必須爲數字!");
	    	document.getElementById('right1').style.display = "none";
			document.getElementById('wrong1').style.display = "block";
	    	document.getElementById('empno').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong1').style.display = "none";
	    	document.getElementById('right1').style.display = "block";
	    }
 
	    if(document.getElementById('empname').value.length==0)
	    {
	    	alert("姓名不能爲空!");
			document.getElementById('wrong2').style.display = "block";
	    	document.getElementById('empname').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong2').style.display = "none";
	    	document.getElementById('right2').style.display = "block";
	    }
 
	    if(document.getElementById('empjob').value.length==0)
	    {
	    	alert("工作不能爲空!");
			document.getElementById('wrong3').style.display = "block";
	    	document.getElementById('empjob').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong3').style.display = "none";
	    	document.getElementById('right3').style.display = "block";
	    }
 
	    if(!document.getElementById("empdate").value.match("^[0-9]{4,4}-[0-9]{2,2}-[0-9]{2,2}$")) 
	    {
	    	alert( "日期格式錯誤 xxxx-xx-xx");
			document.getElementById('wrong4').style.display = "block";
	    	document.getElementById('empdate').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong4').style.display = "none";
	    	document.getElementById('right4').style.display = "block";
	    }
 
	    if(!document.getElementById("empsal").value.match("^[0-9]{1,9}.[0-9]{2,2}$"))
	    {
	    	alert( "工資格式錯誤x...x.xx ");
			document.getElementById('wrong5').style.display = "block";
	    	document.getElementById('empsal').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong5').style.display = "none";
	    	document.getElementById('right5').style.display = "block";
	    }
	    
	    if(!document.getElementById("empbond").value.match("^[0-9]{1,9}.[0-9]{2,2}$"))
	    {
	    	alert( "獎金格式錯誤x...x.xx ");
			document.getElementById('wrong6').style.display = "block";
	    	document.getElementById('empbond').focus();
	    	return false;
	    }else{
	    	document.getElementById('wrong6').style.display = "none";
	    	document.getElementById('right6').style.display = "block";
	    }    
	}
 
</script>
</head>
<body>
<form action="addafter.jsp" method="post" name="emp" onSubmit="return Emp()">
	<h2>增加僱員</h2>
<table>
<tr>
	<td>僱員編號:<input type="text" id="empno" name="empno"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong1" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right1" style='display:none' width="30px" height="30px">
	</td>
</tr>
<tr>
	<td>僱員姓名:<input type="text" id="empname" name="empname"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong2" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right2" style='display:none' width="30px" height="30px">
	</td>
</tr>
<tr>
	<td>僱員工作:<input type="text" id="empjob" name="empjob"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong3" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right3" style='display:none' width="30px" height="30px">
	</td>
</tr>
<tr>
	<td>僱傭日期:<input type="text" id="empdate" name="empdate"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong4" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right4" style='display:none' width="30px" height="30px">
	</td>
</tr>
<tr>
	<td>基本工資:<input type="text" id="empsal" name="empsal"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong5" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right5" style='display:none' width="30px" height="30px">
	</td>
</tr>
<tr>
	<td>僱員獎金:<input type="text" id="empbond" name="empbond"></td>
	<td>
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\錯.png' id="wrong6" style='display:none' width="30px" height="30px">
	<img src='C:\Users\Administrator\Desktop\Mine\Javaweb\實驗三\third\對.png' id="right6" style='display:none' width="30px" height="30px">
	</td>
</tr>
</table>
	<input type="submit" value="提交">
	<input type="reset" value="重置">	
</form>
</body>
</html>
  •  addafter.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.sql.*" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>增加結果</title>
</head>
<%
	request.setCharacterEncoding("UTF-8");
%>
<body>

<%!
	private static final String DBDRIVER = "com.mysql.cj.jdbc.Driver";
	private static final String DBURL = "jdbc:mysql://localhost:3306/emp?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8&useSSL=false";
	private static final String DBUSER = "root";
	private static final String DBPASSWORD = "123456";
%>
<%

	String empno = request.getParameter("empno");//內置對象應該會吧
	String emname = request.getParameter("empname");
	String emjob = request.getParameter("empjob");
	String emhiredate = request.getParameter("empdate");
	String emsal = request.getParameter("empsal");
	String emcomm = request.getParameter("empbond");
	try{
		Class.forName(DBDRIVER);
		Connection con = DriverManager.getConnection(DBURL,DBUSER,DBPASSWORD);//設置數據庫連接
		String sql="insert into emp (empno,ename,job,hiredate,sal,comm) values ('"+ empno +"','"+ emname +"','"+ emjob + "','"+ emhiredate +"','"+ emsal +"','"+ emcomm +"')";
		Statement stmt = con.createStatement();
		//此處最好寫一個查詢僱員編號語句,判斷一下數據庫中是否存在,若存在,增加失敗,給出提示
		if(stmt.executeUpdate(sql)==1){
			%>
			<h3>僱員信息添加成功!</h3>
			<%
			response.setHeader("refresh", "3;url=page.jsp");	//客戶端跳轉,跳轉之後地址欄會變爲跳轉頁面的地址
			%>
			<h3>3秒後跳轉到主界面,若沒有跳轉請按<a href="page.jsp">這裏</a>!</h3>
			<%
		}else{
			%>
			<h3>僱員信息添加失敗</h3>
			<%
		}
		stmt.close();
		con.close();
	}catch(Exception e){
		e.printStackTrace();
	}
%>
</body>
</html>

以上便是完整代碼,不過不建議這樣做,因爲這樣jsp代碼量會非常大,建議用MVC模式,jsp頁面的代碼量越少越好

參考博客:https://blog.csdn.net/jluzh04140717/article/details/70200863

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章