title: Show tree structure data in select box - JQuery, jSon, Ajax
body: <p>I want to show nested data in either "Ul" and "li" or  box but have to show in tree structure.
  So in Json, i am receiving folder structure and I don't know how many folders level Json file has. So I have to write my code to pull the data from JSon file and show the data as tree structure based on the levels.</p>
  
  <p>I am also not sure how my JSon file should look like but i came up with this sample JSon file.
  So what I need is if some one just point me to the correct direction that for achieve the functionality, what structure of JSon file i need to create and what my Ajax Jquery code should look like</p>
  
  <p><strong>JSON file</strong></p>
  
  <pre><code>{
  "folder": [
      {
      "id":"11"
      "name: "test1",
      "path": "site/test1",
      "children": [
          "12",
          "13"
          ]
      },
      {
      "id":"12",
      "name":"sub test1",
      "path":"site/test1/subtest1",
      "children":[
         "21"
         ]
      },
      {
      "id":"13",
      "name":"sub test 2",
      "path":"site/test1/subtest2",
      "children":[]
      },
      {
      "id":"21",
      "name":"sub sub test 1",
      "path":"site/test1/subtest1/subsubtest1",
      "children":[]
      },
      {
      "id":14",
      "name":"test2",
      "path":"site/test2",
      "children":[]
      }
    ]
  }
  </code></pre>
  
  <p><strong>sample JQUERY Code</strong></p>
  
  <pre><code>$.ajax({
          dataType: "json",
          url: "http://localhost/web/folder.json",
          success: function(obj) {
             $.each(obj.folder, function (key, value) { // First Level
                 console.log(value.name);
                 $.each(value.children, function (k, v) {  // The contents inside stars
                     console.log(v);
                 });
             });
          }
         });
  </code></pre>