dynatree : How to convert dynatree data to HTML?
===

I'am using [dynatree][1] 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.

My problem is:<br/>

I need a way to convert this data to HTML (ul-li) structure.

E.g

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

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.

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

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


  [1]: http://wwwendt.de/tech/dynatree/doc/dynatree-doc.html