Im using ASP.NET Core and trying to populate a bootstrap treeview from a ajax call. I can get the response from the server but the tree view doesnt create a tree on the view.
I have installed the package via npm and linked to the css and script. Here is the view:
<div class="row">
<label for="treeview"></label>
<div id="treeview" />
</div>
function getTree() {
$.ajax({
type: 'GET',
url: '/Home/GetTreeNodes',
dataType: "json",
})
.done(function (response) {
$("#treeview").treeview({ data: response })
console.log(response);
})
.fail(function (response) {
console.log(response);
});
}
getTree();
And here is the Json action in my controller:
[HttpGet]
public JsonResult GetTreeNodes(string query)
{
// Tree nodes from db
List<TreeNodes> treeNodes;
// Tree nodes view model
List<TreeNodesViewModel> treeNodesViewModel;
treeNodes = _context.TreeNodes.ToList();
if (!string.IsNullOrWhiteSpace(query))
{
treeNodes = treeNodes.Where(q => q.Name.Contains(query)).ToList();
}
treeNodesViewModel = treeNodes.Where(l => l.ParentId == null)
.Select(l => new TreeNodesViewModel
{
Text = l.Name,
Id = l.Id,
ParentId = l.ParentId,
@Checked = l.Checked,
Children = GetChildren(treeNodes, l.Id)
}).ToList();
return Json(treeNodesViewModel);
}
private List<TreeNodesViewModel> GetChildren(List<TreeNodes> nodes, int parentId)
{
return nodes.Where(l => l.ParentId == parentId).OrderBy(l => l.OrderNumber)
.Select(l => new TreeNodesViewModel
{
Text = l.Name,
Id = l.Id,
ParentId = l.ParentId,
@Checked = l.Checked,
Children = GetChildren(nodes, l.Id)
}).ToList();
}
The only thing that shows up on the view is the root node:
Any help would be greatly appreciated, been searching the net for examples and help but not managed to find anything that descibes why im getting this problem.
