最近做個自助建站系統,設計到一個聯動的選擇框.(也就是一個大類欄目里面有很多小
欄目,當選擇大類欄目的時候,小類列表框要出現相對該大類的所有小類,就象城市和省份
一樣 )。
我寫了個domo測試了一下。。就不知道這樣效率怎么樣。那位有好的辦法。。別忘通知
一聲。
我是這樣做的。先建二張表
我用的是MYSQL
CREATE TABLE `t_bigclass` (
? `b_id` int(11) NOT NULL auto_increment,?
? `b_name` varchar(50) default NULL,
? PRIMARY KEY? (`b_id`)
)
INSERT INTO `t_bigclass` VALUES (1,'大類1');
INSERT INTO `t_bigclass` VALUES (2,'大類2');
INSERT INTO `t_bigclass` VALUES (3,'大類3');
INSERT INTO `t_bigclass` VALUES (4,'大類4');
INSERT INTO `t_bigclass` VALUES (5,'大類5');
CREATE TABLE `t_smallclass` (
? `s_id` int(11) NOT NULL auto_increment,
? `b_id` int(11) default NULL,
? `s_name` varchar(50) default NULL,
? PRIMARY KEY? (`s_id`)
)
插入相應的數據。。。
建個操作數據庫的類。。這個類還是有很多問題的。。不管那里多。運行出來再說。
?
package
?dyoptions.dal;
import
?java.sql.
*
;
import
?java.io.UnsupportedEncodingException;


public
?
class
?dbobject?
{
????
private
?Connection?conn
=
null
;
????
private
?ResultSet?rs
=
null
;
????
private
?Statement?stmt
=
null
;
????
private
?String?url;
????
private
?String?uid;
????
private
?String?pwd;
????
private
?String?jdbc;
????
private
?
boolean
?bflag
=
false
;


????
public
?dbobject()?
{
????}
????
public
?Connection?getSession()?
throws
?SQLException,?ClassNotFoundException,

????????????IllegalAccessException,?InstantiationException?
{
????????url
=
"
jdbc:mysql://localhost:3306/cms
"
;
????????uid
=
"
root
"
;
????????pwd
=
"
wujun
"
;
????????jdbc
=
"
org.gjt.mm.mysql.Driver
"
;
??
????????????Class.forName(jdbc).newInstance();
???????????
????????conn
=
java.sql.DriverManager.getConnection(url,uid,pwd);
???????
return
?conn;
???????
????????
????}
????
public
?String?execSql(
int
?bigid)?
throws
?InstantiationException,
????????????IllegalAccessException,?ClassNotFoundException,?SQLException,

????????????UnsupportedEncodingException?
{
????????
this
.getSession();
????????System.out.print(
"
bigid==
"
+
bigid);
????????String?strsql
=
"
select?*?from?t_smallclass?where?b_id=?
"
;
???????PreparedStatement?ps
=
?conn.prepareStatement(strsql);
???????ps.setInt(
1
,bigid);
???????rs
=
ps.executeQuery();
????????System.out.print(
"
rowwwww
"
+
rs.getRow());
????????java.lang.StringBuffer?sb
=
new
?StringBuffer(
"
<test>
"
);
?????
while
(rs.next())

???????
{
???????????System.out.print(rs.getInt(
1
));
???????????
//
String?temp=new?String(rs.getString(4).getBytes("ISO-8859-1"),"gb2312");
????????????sb.append(
"
<id>
"
+
rs.getInt(
1
)
+
"
</id>
"
);
???????????sb.append(
"
<small>
"
+
rs.getString(
4
)
+
"
</small>
"
);
??????????
//
?System.out.print(rs.getString(2));
???????????
//
System.out.print(rs.getString(3));
???????}
???????sb.append(
"
</test>
"
);
???????System.out.print(sb.toString());
????ps.close();
????rs.close();
????conn.close();
???
return
?sb.toString();

????}
???
????
}
再來一個 servlet,doget方法代碼
public?void?doGet(HttpServletRequest?request,?HttpServletResponse?response)?throws
????????????ServletException,?IOException

?????????????
{
????????response.setContentType("text/xml");
????????response.setCharacterEncoding("UTF-8");
????????response.setHeader("Cache-Control",?"no-cache");
????????int?bigid=Integer.parseInt(request.getParameter("bigid"));
????????dbobject?dd=new?dbobject();
????????String?str?=?null;

????????try?
{
????????????str?=?dd.execSql(bigid);

????????}?catch?(SQLException?ex)?
{

????????}?catch?(ClassNotFoundException?ex)?
{

????????}?catch?(IllegalAccessException?ex)?
{

????????}?catch?(InstantiationException?ex)?
{
????????}
????????PrintWriter?out=response.getWriter();
????????out.write(str.toString());
????????out.close();

??//out.print(str);

????}建個jsp看看。。

<%
@?page?contentType="text/html;?charset=GBK"?%>

<html>
<head>
<title>
jsp1
</title>

<script?type="text/javascript">

?function?getResult(stateVal)?
{
var?url?="servlet1?bigid="+stateVal;?

if?(window.XMLHttpRequest)?
{?//Mozilla?瀏覽器
??req?=?new?XMLHttpRequest();?

}else?if?(window.ActiveXObject)?
{?//?IE瀏覽器
??req?=?new?ActiveXObject("Microsoft.XMLHTTP");?
}?

if(req)
{?//?沒有異常,繼續執行
?????req.onreadystatechange?=?processRequest;?
?? req.open("GET",url,?true);?
?? req.send(null);?
}?else
??????????alert("err");
?}?
??//?處理返回信息的函數

function?processRequest()
{

if?(req.readyState?==?4)?
{?//?判斷對象狀態

if?(req.status?==?200)?
{?//?信息已經成功返回,開始處理信息
????//alert(req.responseText);
???//?alert(req.responseXML.getElementsByTagName("small"));
??var?city?=?req.responseXML.getElementsByTagName("small");
????
????var?smallid=req.responseXML.getElementsByTagName("id");
?? alert(smallid.length);
?? var?str=new?Array();
?????var?smid=new?Array();

??for(var?i=0;i<city.length;i++)
{
?????str[i]=city[i].firstChild.data;
?????????smid[i]=smallid[i].firstChild.data;
??}
? //alert(document.getElementById("city"));
? buildSelect(str,document.getElementById("small"),smid);
}
}
}

function?buildSelect(str,sel,smid)?
{
sel.options.length=0;

for(var?i=0;i<str.length;i++)?
{
sel.options[sel.options.length]=new?Option(str[i],smid[i])
}
}
function?showid()


{
??if(document.getElementById("city").value=="")

??
{
????alert("null");
??}
??else
???alert(document.getElementById("city").value);
}
</script>
</head>
<body?bgcolor="#ffffff">
<h1>
JBuilder?Generated?JSP
</h1>

<select?name="state"?onChange="getResult(this.value)">
<option?value="2">大類2</option>>
<option?value="3">大類3</option>>
<option?value="4">大類4</option>>
????<option?value="5">大類5</option>>
<option?value="1">大類1</option>>
<option?value="11">大類100</option>>
</select>
<select?id="city">
<option?value="">smallclass</option>
</select>
<input?type="button"?onclick="showid()"??value="查看小類的結果"/>
</body>
</html>

OK...
還在改。。先把他記下來。。