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）になりますが、子のunordered-list（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）を追加して起動しました

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

働き。これは（SEO / URLリンクと視覚化の問題のために）最も便利な方法ではありませんが、それを行う最も簡単な方法のようです。

于 2012-07-28T22:32:06.477 に答える