之前遺留一個老問題:列表模糊查詢,用的直接是form提交,點擊搜索按扭后,頁面刷新,搜索框中關鍵詞就沒了,這雞肋的體驗,我發誓一定要搞定它
但是鑒於自己寫代碼是純粹玩票,我寫代碼沒有目標,只有在當前工作中找不到自信的時候,我會通過寫代碼來鼓勵自己更加自信
寫了這么久,一個系統也是要寫很久的,這其中很多細節點,都得一步步的搞定,而且中間可能調試時候遇到很多問題,也得慢慢查
這個功能是很早之前欠下自己的,搞了3天,終於出來了。涉及的點,我准備用一長篇來講述清楚
老習慣,先看下效果:

下面講一下思路:
1、首先訪問servlet出全列表內容
2、查詢為空判斷,跳轉默認首頁出列表全內容
3、查詢條件傳入servlet,根據查詢條件出內容
帖整體代碼:
test.jsp
<%@page import="java.sql.Timestamp"%>
<%@page import="entity.User"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!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>Insert title here</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
var search = $("#search").val();
alert(search);
$("#all tr td").remove();
if(search==null ||search==""){
alert("查詢條件不能為空!");//要判斷一下,否則的話,要出全部列表,我下面已經有出全部列表的了,
parent.document.location.href="<%=request.getContextPath()%>/userListServlet";//必須得這一步,否則會空列表
}else{
$.ajax({
type:"POST",
url:"<%=request.getContextPath()%>/userListServlet",
data:{
"search":search,
},
DataType:"json",
success:function(data){
var dataObj = eval("("+data+")");
//alert(dataObj);
var a=null;//主要是因為json是個數組,有多列結果的時候,得拼接+
$.each(dataObj,function(i,item){
//alert(dataObj.length);
//alert("這是:"+item.id+","+item.username);
a += '<tr>'+
+'<td id="id">'+item.id+'</td>'
+'<td id="name">'+item.username+'</td>'
+'<td id="status">'+item.status+'</td>'
+'<td id="isAdmin">'+item.isAdmin +'</td>'
+'<td id="createTime">'+item.createTime+'</td>'
+'</tr>';
})
$("#all").append(a);
},
});
}
})
});
</script>
</head>
<body>
<div>
<input type="text" name="search" id="search"/>
<input type="button" name="btn" id="btn" value="搜索"/>
<table id="all">
<tr>
<th>id</th>
<th>name</th>
<th>status</th>
<th>isAdmin</th>
<th>createTime</th>
</tr>
<!--之所以為什么這么麻煩還得再求一遍全列表數據,是因為我笨,我想不到其它辦法,只有麻煩一些了,這是不輸入查詢條件時候的結果-->
<%
List<User> userList = (List<User>)request.getAttribute("userList");
if(userList==null){
%>
<tr>
<td >沒有數據</td>
</tr>
<%}else{
for(int i=0;i<userList.size();i++){
User user = userList.get(i);
%>
<tr>
<td id="id"><%=user.getId() %></td>
<td id="name"><%=user.getUsername() %></td>
<td id="status"><%=user.getStatus() %></td>
<td id="isAdmin"><%=user.getIsAdmin() %></td>
<td id="createTime"><%=user.getCreateTime()%></td>
</tr>
<%}%>
<%} %>
</table>
</div>
</body>
</html>
servlet:
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Date;
import java.text.SimpleDateFormat;
import java.util.List;
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 entity.User;
import net.sf.json.JSONArray;
import net.sf.json.JsonConfig;
import net.sf.json.processors.JsDateJsonValueProcessor;
import net.sf.json.processors.JsonValueProcessor;
import service.UserService;
import service.impl.UserServiceImpl;
@WebServlet(name = "userListServlet", urlPatterns = { "/userListServlet" })
public class UserListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public UserListServlet() {
super();
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
PrintWriter print=response.getWriter();
UserService userService=new UserServiceImpl();
String search = request.getParameter("search");//這里是因為遇到了一個問題,JSONArray轉換日期報錯,java.lang.reflect.InvocationTargetExce,http://blog.csdn.net/zz210891470/article/details/52447507
JsonConfig jsonConfig=new JsonConfig();
//下面這個方法可以另起一個util類里寫工具方法,但我只想快快驗證,所以就寫一起了
jsonConfig.registerJsonValueProcessor(java.sql.Date.class,new JsonValueProcessor() {
private final String format="yyyy-MM-dd";
public Object processObjectValue(String key, Object value,JsonConfig arg2){
if(value==null)
return "";
if (value instanceof java.sql.Date) {
String str = new SimpleDateFormat(format).format((java.sql.Date) value);
return str;
}
return value.toString();
}
public Object processArrayValue(Object value, JsonConfig arg1){
return null;
}
});
//對搜索的關鍵字進行判斷處理
System.out.println("search==="+search);
if(search==null || search.equals("")) {//如果搜索框不輸入,第一次進入列表的時候肯定是這種情況,另外就是輸入框中為空點擊搜索也是這種情況統一處理
List<User> userList = userService.findUserByLikeName("");
System.out.println(userList.size());
request.setAttribute("userList", userList);
request.getRequestDispatcher("page/test.jsp").forward(request,response);
//我就用了最老實最原始最笨的上面這種servlet朝jsp傳值的方法。然后在jsp中又是代碼寫呀寫拼呀拼
}else {
//如果搜索條件不為空
List<User> userList = userService.findUserByLikeName(search);
System.out.println("有幾條數據:"+userList.size());
String json = JSONArray.fromObject(userList,jsonConfig).toString();
print.print(json);//通過ajax傳給頁面
}
}
}
總結:要說知識點,其實都是一些常見的很基礎的點,但是最重要的是測試,測試各種情況,我這篇博寫了1天,原因是,當我准備放上去的時候,我去測試了搜索n這個關鍵字發現TMD只顯示1行,數據都沒有問題,但是最后一條覆蓋了第一條。才發現有些地方寫的不對,然后我就改啊改,越改越亂。越測越有問題。越來越覺得,寫代碼之前如果沒有清晰的設計思路,根本做不好,中間會返很多遍。
