Parser un json multiniveaux dans une dropdownlist.

relis ta doc..

JSON.parse transforme du texte en json.

ta variable data est déjà du json, donc pas besoin de la transformer en json

Sinon JSON fait partie de l'adn de JavaScript, utiliser jQuery pour parcourir une arborescence json, c'est un peu délirant (amha)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <title>JSON => select </title>
  <style>
    #vehicules {  width: 12em; }
  </style>
</head>
<body>
 
  <select id="vehicules" size="11"></select>
 
  <script>
    const data = [
      {
        "id": 3, "content": "Fiat", "order": 1, "children":
          [
            { "id": 5, "content": "2roue", "order": 1, "children":
              [
                { "id": 1, "content": "Voitures", "order": 1, "children": null, "parent": 5, "level": 3 }, 
                { "id": 2, "content": "Renault", "order": 2, "children": null, "parent": 5, "level": 3 }
              ],
              "parent": 3,
              "level": 2
            }
          ],
        "parent": 0,
        "level": 1
      },
      {
        "id": 5, "content": "2roue", "order": 1, "children":
          [
            { "id": 1, "content": "Voitures", "order": 1, "children": null, "parent": 5, "level": 3 }, 
            { "id": 2, "content": "Renault", "order": 2, "children": null, "parent": 5, "level": 3 }
          ],
        "parent": 3,
        "level": 2
      },
      { "id": 1, "content": "Voitures", "order": 1, "children": null, "parent": 5, "level": 3 },
      { "id": 4, "content": "Scenic", "order": 2, "children": null, "parent": 0, "level": 1 }
    ];
 
    const SelectVehicules = document.querySelector('#vehicules');
 
 
    function AddChildrens( parent, prefix , node )
    {
      if ( Array.isArray(node) ) 
      {
        for ( subNod of node )
        {
          let child = document.createElement('OPTION');
          child.textContent    = prefix + subNod.content;
          parent.appendChild( child );
 
          AddChildrens( parent, prefix + '-' , subNod.children );
        }
      }
    }
 
    for( desc of data)
    {
      let group   = document.createElement('OPTGROUP');
      group.label = desc.content;
 
      AddChildrens( group , '-', desc.children );
 
      SelectVehicules.appendChild(  group );
    }
  </script>
</body>
</html>