
- 帖子
- 1
- 主題
- 0
- 精華
- 0
- 積分
- 3
- 威望
- 0
- 金錢
- 1
|
Dear 版主,
在網路上很難找到 jquery 的 JSP 範例程式.
昨日用此論壇討論說明, 改寫 Viral Patel 的 Tutorial: Create Autocomplete feature with Java – JSP / jQuery.
1. auto_tString.jsp (亦可寫為 .html)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />
<script type="text/javascript" src="./js/jquery.js"></script>
<script type='text/javascript' src='./js/jquery.autocomplete.js'></script>
<script type='text/javascript' src='./js/jquery.ajaxQueue.js'></script>
<script type="text/javascript">
$(function() {
$("#tString").autocomplete("test_auto.jsp", {minChars: 0,
max: 12,
autoFill: true,
mustMatch: false,
matchContains: false,
scrollHeight: 240});
});
</script>
</head>
<body>
<p>
tString AutoComplete <input type="text" name="tString" id="tString" />
</body>
</html>
2. test_auto.jsp
<%@page import="java.util.Iterator"%>
<%@page import="java.util.List,java.util.ArrayList"%>
<%
// DummyDB db = new DummyDB();
String query = request.getParameter("q");
List<String> tt=new ArrayList<String>();
tt.add("aaa");
tt.add("abbc");
tt.add("accd");
tt.add("adde");
Iterator<String> iterator = tt.iterator();
while(iterator.hasNext()) {
String tString = (String)iterator.next();
out.println(tString);
}
%>
兩個程式即使用 Ajax 完成 Autocomplete, 將 tt.add 放入資料庫 SELECT 出來的 Data.
應該可以完成 Database 的 Autocomplete 功能. |
|