@model User
@using System.Text
@{
ViewData["Title"] = "User details";
}
<table class="table">
<tbody>
<tr>
<th scope="row">Display Name</th>
<td>@Model.DisplayName</td>
</tr>
<th scope="row">Accounts</th>
<td>
<div id="accountsTree"></div>
</td>
<th scope="row">Permission Tags</th>
<div id="tagsTree"></div>
</tbody>
</table>
@section Scripts{
<script type="text/javascript">
var detailLink='<a asp-controller="Accounts" asp-action="Details" asp-route-id="accid">Details</a>;
@foreach (var acc in Model.Accounts)
{
<div class="account @acc.Protocol">
<div class="protocol-icon"> </div>
@Html.DisplayFor(acc => acc.DisplayName)
<a asp-controller="Accounts" asp-action="Details" asp-route-id="@acc.Id">Details</a>
</div>
function getTree() {
var sb = new StringBuilder();
sb.Append("[{text: \"accounts\", \"expanded\":true, nodes: [");
var first = true;
foreach (var acc in Model.Accounts)
if(!first)
sb.Append(',');
sb.Append($"{{text: \"<div class=\"account {acc.Protocol}\"><div class=\"protocol-icon\"> </div>{Html.DisplayFor(acc => acc.DisplayName)}Details\"}}");
first=false;
sb.Append("}]");
var tree = @Html.Raw(sb.ToString());
console.log(tree);
return tree;
$('#accountsTree').bstreeview({ data: getTree() });
</script>