使用 jQuery 製作樹狀目錄
過陣子可能有個案子要使用到無限多層的表達方法,參考過 YUI ,但是自己對於 jQuery 比較熟悉,所以就使用 Treeview plugin 來製作。
資料表的結構也很簡單,我規劃下列幾個欄位:
- 編號 id – int(4) auto_increment)
- 標籤名稱 label – varchar(50)
- 父項目編號 parent – int(4)
- 排序 sort – int(4)
php 端採用遞迴方式實做:
function treeview($parent) {
$sql = " SELECT * FROM items WHERE parent=$parent";
$result = mysql_query($sql);
$output = array();
while($record = mysql_fetch_array($result)){array_push($output, $record);}
$cc = count($output);
if(!$parent == 0){
if($cc > 0) echo ("
\n");
}
for($i=0; $i 0) {
$str_a = "";
$str_b = "";
} else {
$str_a = "";
$str_b = "";
}
echo ("- " . $str_a . $output[$i]['label'] . $str_b);
treeview($output[$i]['id']);
}
if(!$parent == 0) {
if($cc > 0)
echo ("
\n\n");
else
echo ("\n");
}
}
過陣子可能有個案子要使用到無限多層的表達方法,參考過 YUI ,但是自己對於 jQuery 比較熟悉,所以就使用 Treeview plugin 來製作。
資料表的結構也很簡單,我規劃下列幾個欄位:
- 編號 id – int(4) auto_increment)
- 標籤名稱 label – varchar(50)
- 父項目編號 parent – int(4)
- 排序 sort – int(4)
php 端採用遞迴方式實做:
function treeview($parent) {
$sql = " SELECT * FROM items WHERE parent=$parent";
$result = mysql_query($sql);
$output = array();
while($record = mysql_fetch_array($result)){array_push($output, $record);}
$cc = count($output);
if(!$parent == 0){
if($cc > 0) echo ("
- \n");
}
for($i=0; $i
- " . $str_a . $output[$i]['label'] . $str_b); treeview($output[$i]['id']); } if(!$parent == 0) { if($cc > 0) echo ("