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

原創 fyydashen 2018-12-01 00:00

前提是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

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

N網下載mod方法: 20240614親測好使

https://www.bilibili.com/video/BV1k8411575T/?vd_source=d68ed178f151e80fea1e02efd205802c

張博的博客 2024-06-15 14:23:44

Libgdx遊戲開發(3)——通過柏林噪音算法地圖隨機地形

原文: Libgdx遊戲開發(3)——通過柏林噪音算法地圖隨機地形-Stars-One的雜貨小窩 在B站刷到了隨機地圖生成的視頻,隨手學習下並做下記錄 注: 本篇使用javafx應用作演示,算是瞭解這個算法的使用,後續會再出篇libgdx

Stars-one 2024-06-15 14:23:14

電子行業MES系統流程圖梳理

 

DayVK 2024-06-15 14:22:44

langchain Chatchat 學習實踐（四）——實現對Text2Sql的支持

這裏記錄一下langchain chatchat項目中的text2sql的實現思路。 1、SQLDatabaseChain鏈 SQLDatabaseChain是langchain框架自帶的數據庫自然語言交互工具，其內部通過sqlalchem

鄭某 2024-06-15 14:19:14

python cuda12 安裝

pip install torch2.3.0 torchvision0.18.0 torchaudio==2.3.0 --index-url https://download.pytorch.org/whl/cu121

菊花茶 2024-06-15 14:15:03

解決#error -- unsupported GNU version! gcc versions later than 11 are not supported!

ubuntu系統gcc版本太高導致cuda編譯報錯，可以手動切換gcc版本： #切換gcc版本 sudo update-alternatives --config gcc #切換g++版本 sudo update-alternatives

Dsp Tian 2024-06-15 14:14:43

Codeforces Global Round 26 D ''a'' String Problem（思維）

這題思維性很強，沒搞出來，純記錄一下。看題解看了很久纔看懂。代碼補充了幾個例子幫助理解。思路可以參考Codeforces Global Round 26 (A - E) - Lu_xZ - 博客園 (cnblogs.com) 1 #de

SnowLove 2024-06-15 14:14:03

前端使用 Konva 實現可視化設計器（15）- 自定義連接點、連接優化

前面，本示例實現了折線連接線，簡述了實現的思路和原理，也已知了一些缺陷。本章將處理一些缺陷的同時，實現支持連接點的自定義，一個節點可以定義多個連接點，最終可以滿足類似圖元接線的效果。 請大家動動小手，給我一個免費的 Star 吧~ 大家如

xachary 2024-06-15 14:11:43

爲centos7系統添加新用戶並設置祕鑰登陸

要在CentOS 7系統上創建一個新用戶evan，並禁止其使用密碼登錄而僅允許密鑰登錄，你可以按照以下步驟操作： 創建新用戶 使用root賬號登錄到CentOS 7系統，然後運行以下命令來創建新用戶evan：            

憤怒的碼農 2024-06-15 14:09:23

Odoo jsonb查詢

1. ->>查詢具體字段   SELECT * FROM product_template WHERE description_purchase->>'en_US' = 'purchase_food'   2. ::name 完整字符串匹配

若-飛 2024-06-15 14:07:53

在 Solidity 中將地址類型轉換爲 IERC20 接口類型

在智能合約開發中，尤其是涉及到 ERC-20 代幣交互時，開發者常常需要將一個地址類型轉換爲 IERC20 接口類型。這樣做的目的是爲了調用接口中的函數，如 transfer 和 approve。本文將詳細講解這一過程，並簡要介紹相關的背景

若-飛 2024-06-15 14:07:53

solidity calldata學習

在 Solidity 中，calldata 是一種數據位置標識符，用於指定函數參數的存儲位置。calldata 特別適用於函數的外部調用參數，並且是隻讀的。以下是對 Solidity 中數據位置的一些說明： storage: 用於狀態變量

若-飛 2024-06-15 14:07:53

理解 Solidity 中的修飾器（Modifiers)

在智能合約開發中，代碼的可讀性和安全性至關重要。Solidity 作爲以太坊上最常用的編程語言，爲開發者提供了一種強大的工具——修飾器（modifiers）。修飾器可以在函數調用前後執行特定的代碼，簡化邏輯並增強合約的安全性。本文將深入探討

若-飛 2024-06-15 14:07:53

探索 Solidity 中的各種修飾符

探索 Solidity 中的各種修飾符 在智能合約開發中，確保代碼的安全性、可讀性和高效性至關重要。Solidity 作爲以太坊上最廣泛使用的編程語言，提供了一系列的修飾符來幫助開發者實現這些目標。本文將深入探討 Solidity 中的各種

若-飛 2024-06-15 14:07:53

全球國家或地區ISO代碼，IOS2編碼，IOS3編碼

最近項目需要使用到全球國家或地區ISO編碼。發現網上並沒有完整的數據，然後就自己抓了一些數據回來。 分享給大家，拿來可以直接使用。 excel文件：https://github.com/mtyh/CountryCodeCrawler/tre

明天以後 2024-06-15 14:05:12