After going through numerous discussions and solving several issues along the way, I have encountered a major problem where there is no output.
As mentioned before, I am utilizing Bootstrap Tree View:
To establish the hierarchical structure required for the tree, it is essential to provide a nested array of JavaScript objects.
For example:
var tree = [
{
text: "Parent 1",
nodes: [
{
text: "Child 1",
nodes: [
{
text: "Grandchild 1"
},
{
text: "Grandchild 2"
}
]
},
{
text: "Child 2"
}
]
},
{
text: "Parent 2"
},
{
text: "Parent 3"
},
{
text: "Parent 4"
},
{
text: "Parent 5"
}
];
The Array Output for My Categories:
Array
(
[0] => Array
(
[text] => Housing
[href] => http://localhost/projekte/application/housing/housing
[tags] => ['5']
[nodes] => Array
(
[0] => Array
(
[text] => House
[href] => http://localhost/projekte/application/house/house
[tags] => ['20']
)
[1] => Array
(
[text] => Shared Apartments - Rooms
[href] => http://localhost/projekte/application/shared-apartments-rooms/shared-apartments-rooms
[tags] => ['19']
)
[2] => Array
(
[text] => Apartment
[href] => http://localhost/projekte/application/apartment/apartment
[tags] => ['18']
)
)
)
...
// Remaining category arrays excluded for brevity
)
This is the code responsible for displaying the Tree:
<div class="treeview" id="treeview1">
<ul class="list-group">
</ul>
</div>
<script type='text/javascript'>
var js_data = <?php json_encode($tree,JSON_FORCE_OBJECT) ?>;
var js_obj_data = JSON.parse(js_data );
function getTree() {
return js_obj_data;
}
$('#treeview1').treeview({data: getTree()});
</script>
NOTE: Despite my research efforts, I could not find a solution to my dilemma. Any help would be appreciated. Thank you.