[英]dynatree : How to convert dynatree data to HTML?
I'am using dynatree plugin to code an Online App and i'am using toDict() method for converting the tree data into a JavaScript object then storing in a database. 使用我' dynatree插件来编写一个在线应用程序和我'使用toDict()方法用于树数据转换成JavaScript对象然后存储在数据库中。
My problem is: 我的问题是:
I need a way to convert this data to HTML (ul-li) structure. 我需要一种将这些数据转换为HTML(ul-li)结构的方法。
Eg 例如
Title 1
Title 2
+Title 2.1
+Title 2.2
Title 3
form should be converted to: 表格应转换为:
<ul>
<li>Title 1</li>
<li>Title 2
<ul>
<li>Title 2.1</li>
<li>Title 2.2</li>
</ul>
</li>
<li>Title 3</li>
</ul>
above form. 以上表格。 How can be done in PHP (data will be given from database)?
如何在PHP中完成(数据将从数据库提供)?
Data sample: 数据样本:
{"title":"Products", "key":"products", "isFolder":true, "isLazy":false, "tooltip":null, "href":null, "icon":null, "addClass":null, "noLink":false, "activate":false, "focus":false, "expand":true, "select":false, "hideCheckbox":true, "unselectable":false, "children":[{"title":"Product 1 Category", "key":"products-product-1-category", "isFolder":true, "isLazy":false, "tooltip":"Product 1", "href":null, "icon":null, "addClass":null, "noLink":false, "activate":false, "focus":false, "expand":true, "select":false, "hideCheckbox":false, "unselectable":false, "children":[{"title":"Product 1.1 Category", "key":"products-product-1-product-11-category", "isFolder":true, "isLazy":false, "tooltip":"Product 1.1 Category", "href":null, "icon":null, "addClass":null, "noLink":false, "activate":true, "focus":false, "expand":true, "select":false, "hideCheckbox":false, "unselectable":false, "children":[{"title":"Product Name", "key":"products-product-1-category-product-11-category-product-name", "isFolder":false, "isLazy":false, "tooltip":"Product Name", "href":null, "icon":null, "addClass":null, "noLink":false, "activate":false, "focus":false, "expand":false, "select":false, "hideCheckbox":false, "unselectable":false}]}]}]}
NOTE : isFolder means, it will be list item (li) but will have a child unordered-list (ul-li) structure. 注意 :isFolder表示它将是列表项(li),但将具有子无序列表(ul-li)结构。
Above data structure is equal to: 上面的数据结构等于:
Products (isFolder = true)
+Product 1 Category (isFolder = true)
+Product 1.1 Category (isFolder = true)
+Product Name (isFolder = false)
and HTML form shold be like below (or any other expandable/collapsable list style menu form): 和HTML表单保存如下(或其他任何可扩展/可折叠列表样式菜单表单):
<ul>
<li>Products
<ul>
<li>+Product 1 Category
<ul>
<li>+Product 1.1 Category
<ul>
<li>+Product Name</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
Because of i couldn't found a better solution then dynatree's own way ,i've solved the problem by using Dynatree's own listing mechanism. 由于无法找到比dynatree自己的方式更好的解决方案,因此我使用Dynatree自己的列表机制解决了该问题。
I've included Dynatree.js, added a div (id=tree) and fire 我包含了Dynatree.js,添加了div(id = tree)并启动
$('#tree').dynatree();
function. 功能。 It is not most useful way (because of SEO/url linking and visualization issues) but it seems the easiest way to do it.
这不是最有用的方法(由于SEO / URL链接和可视化问题),但它似乎是最简单的方法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.