ตัวอย่าง tree menu จาก ฐานข้อมูล คือพอจะเข้าใจหลักการ แต่ไม่รู้จะวางอะไรยังไงดี

session_start();
include('inc/dbclass/connect.php');  //ส่วนของการ connection ขึ้นอยู่กับของแต่ละคน (ยังไงก็ได้)

function tree_html($id = null)
{	
	$ret = '';
	if (null == $id) $q_id = 'id_par IS NULL';
	else $q_id = 'id_par = '.(int)$id;
	
	if ($_SESSION['depid'] <> '4') {  // บันทัดนี้ผมเพิ่มเข้ามาเพื่อใช้ในการตรวจสอบในกรณีพิเศษครับ อันนี้แค่ตัวอย่างนะครับ (ถ้าไม่ใช้ก็ตัดทิ้งได้)
		$q_id .= ' AND adm = "N"';
	}

$result = mysql_query('SELECT * FROM menu WHERE status = "Y" AND '.$q_id.' ORDER BY level'); // บันทัดนี้คือการคิวรี่ ปกติในตัวอย่างจะมี 3 ฟิลดิ์คือ id, name, id_par เท่านั้น แต่ผมเพิ่มการตรวจสอบสถานะและการจัดเรียงตาม level เอาไว้ด้วยเลยเป็นประมาณนี้ครับ เพราะฉะนั้นคิวรี่ของเดิมจะแตกต่างจากผมนะครับ
	
	$childs = array(); //ตั้งค่าตัวแปรเพื่อรับค่า โดยกำหนดให้เป็น array

	while ($row = mysql_fetch_assoc($result)) { // ต่อเนื่องจากบันทัดบนครับ loop เอาค่าที่คิวรี่ใส่ไว้ใน array
		$childs[] = $row;
	}


//ข้างล่างนี้เป็นส่วนสำคัญครับ คือการ loop เพื่อเอาค่าทั้งหมดมาจัดเรียงใส่ไว้ในตัวแปร $ret ก่อนที่จะนำไปใช้กับจาวา
//สังเกตุตรง tag a นะครับ เพราะมันคือ event ที่เราจะให้แต่ละเมนูคลิกแล้วทำอะไรบ้าง ซึ่งผมใช้ฟิลดิ์เก็บข้อมูลการคลิกของแต่ละเมนูแยกกัน
//เพราะฉะนั้น แต่ละเมนูจะมีการเรียกใช้ฟังก์ชั่นแตกต่างกันอย่างอิสระ ข้อดีก็คือถ้าเราทำระบบหลังบ้านก็สามารถ insert ข้อมูลฟังก์ชั่นลงฐานข้อมูลไปเลย
//จะเพิ่ม ลบ แก้ไข อย่างไรก็สะดวกครับ
    foreach ($childs as $row)
    {
        $row['name'] = str_replace(array("'", '"'), '', $row[name]);
        $row['name'] = htmlspecialchars($row['name']);

        $nest = tree_html($row[id]);
        if ($nest) {
            $ret .= '<div class="folder '.trim($row[iconclass]).'" id="tree-'.$row[id].'">';         
			$ret .= '<a href="Javascript:'.$row[script].'">'.$row[name].'</a>';			
			$ret .= $nest;
            $ret .= '</div>';
        } else {
            $ret .= '<div class="doc '.trim($row[iconclass]).'" id="tree-'.$row[id].'">';
            $ret .= '<a href="Javascript:'.$row[script].'" >'.$row[name].'</a>';
            $ret .= '</div>';
        }
    }
    return $ret;
}
?>

//ข้างล่างนี้คือที่จะเอาข้อมูลมาแสดงให้เป็นเมนู tree 
<div class="DynamicTree">
	<div class="top">Index</div>
	<div class="wrap" id="tree">
		<?php echo tree_html();?>
	</div>
</div>

//ข้างล่างนี้ก็เป็นสคริปจาวาตามตัวอย่างครับ ตั้งค่าได้ตามชอบเลย

<script type="text/javascript">
var tree = new DynamicTree("tree");
    tree.foldersAsLinks = true;
	tree.foldersAsLinks2 = true;
    tree.enableSetActive = true;
	tree.path = 'img/icons/';
    tree.icons = {
        	"help" : "img/Xiao Icon/51.png", // ส่วนนี้ก็เป็นการกำหนดให้เมนูบางเมนูมีไอคอนตามที่เรากำหนด (free style)
	"home" : "img/Xiao Icon/61.png",
	"homeOpen" : "img/Xiao Icon/63.png",
	"exit" : "img/lock.gif",
	"log" : "img/log.png",
	"write" : "img/Xiao Icon/60.png",
	"announce" : "img/002_26.png",
	"adm" : "img/Xiao Icon/37.png",
	"admOpen" : "img/Xiao Icon/38.png",
	"admusr" : "img/user_edit.png",
	"fload" : "img/Xiao Icon/22.png",
	"stat" : "img/Xiao Icon/53.png"
    };
	tree.init();
	tree.openTo("tree-19"); // ส่วนนี้คือการกำหนดให้เมนูหลักบางเมนู expand ออกมาตั้งแต่การเปิดครั้งแรกเลย
	tree.openTo("tree-1");
	tree.openTo("tree-2");
	tree.openTo("tree-21");
</script>