轉自：http://www.cnblogs.com/isaboy/p/bootstrap_admin_template_adminlte_theme_dynamic_tree_from_datatable.html
當前的應用設計風格趨於Flat扁平化，很多基於BootStrap實現了很多UI非常漂亮的管理界面(Bootstrap admin template)。
此核心文件開源在Github:https://github.com/JackWangCUMT/AdminLTE-Menu-Generate。首先看一下主界面：
查看左邊導航的菜單html結構(下面代碼有錯誤，HTML自定義屬性直接用空格進行分割，而不是,號進行分割，不然jquery獲取定義屬性時可能會出現錯誤）：
通過觀察，可以發現其中菜單樹的特點，這里注意一下，菜單頂級的標題顯示在span中，另外class也不同。那邊如何從數據庫動態生成符合此特征的treemenu結構呢？
1 數據庫字段設計
2 演示數據
5 菜單類實現：
首先樹結構的菜單，自然想到用遞歸來構建（去掉html自定義屬性的分割,號，用空格代替），代碼如下：
View Code
6 調用
7 測試
驗證生成的菜單結構是否正確，首先看看顯示的層級結構和數據庫是否一致，另外查看單擊上級，是否可以展開，最后注意的是，在左邊菜單收縮后，只顯示圖標，鼠標移動到圖標上后，並能正確顯示子菜單：
8 應用
假設菜單是這樣的：
用jquery可以在單擊菜單某項時，打開頁面
核心文件開源在Github:https://github.com/JackWangCUMT/AdminLTE-Menu-Generate。
水平有限，望各位園友不吝賜教！如果覺得不錯，請點擊推薦和關注！
出處： http://www.cnblogs.com/isaboy/
聲明：本文版權歸作者和博客園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接，否則保留追究法律責任的權利。
出處： http://www.cnblogs.com/isaboy/
聲明：本文版權歸作者和博客園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接，否則保留追究法律責任的權利。