0

我正在使用dynatree插件对在线应用程序进行编码，并且我正在使用 toDict() 方法将树数据转换为 JavaScript 对象，然后存储在数据库中。

我的问题是：

我需要一种将这些数据转换为 HTML (ul-li) 结构的方法。

例如

Title 1
Title 2
  +Title 2.1
  +Title 2.2
Title 3

表格应转换为：

<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>

上面的表格。如何在 PHP 中完成（数据将从数据库中提供）？

数据样本：

{"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}]}]}]}

注意：isFolder 表示，它将是列表项 (li)，但将具有子无序列表 (ul-li) 结构。

上面的数据结构等于：

Products (isFolder = true)
  +Product 1 Category (isFolder = true)
    +Product 1.1 Category (isFolder = true)
      +Product Name (isFolder = false)

和 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>
4

1 回答 1

0

因为我找不到比dynatree自己的方法更好的解决方案，我通过使用dynatree自己的列表机制解决了这个问题。

我已经包含了 Dynatree.js，添加了一个 div (id=tree) 和 fire

$('#tree').dynatree();

功能。这不是最有用的方法（因为 SEO/url 链接和可视化问题），但它似乎是最简单的方法。

于 2012-07-28T22:32:06.477 回答