Как отобразить иерархию с помощью строк начальной загрузки — столбцов ⇐ C#

[Anonymous]

Сейчас у меня есть плоский список, который представляет многоуровневые иерархические данные, а затем преобразую его в иерархию. Но при попытке отобразить это в виде вертикальной диаграммы я совершенно теряюсь, поскольку визуализация порядка не совсем правильная.
Модель

Код: Выделить всё

using System;
using System.ComponentModel.DataAnnotations;
using System.Collections.Generic;

namespace HelloWorldMvcApp
{
public class ScriptHierarchy
{
public int IdScript_FK { get; set; }
public int? ParentId { get; set; }
public int Id { get; set; }
public string Title { get; set; }
public int Level { get; set; }
public int BreadthDepth { get; set; }

public List Children = new List();
}
}

Контроллер

Код: Выделить всё

using System;
using System.Web.Mvc;
using System.Collections.Generic;
using System.Linq;

namespace HelloWorldMvcApp
{
public class HomeController : Controller
{
[HttpGet]
public ActionResult Index()
{
List model = new List
{
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = null,
Id = 1,
Title = "Greeting",
Level = 1,
BreadthDepth = 1
},
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = 1,
Id = 2,
Title = "Benefits",
Level = 2,
BreadthDepth = 2
},
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = 2,
Id = 3,
Title = "Objections",
Level = 3,
BreadthDepth = 3
},
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = 2,
Id = 4,
Title = "Closing - Sale",
Level = 3,
BreadthDepth = 4
},
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = 3,
Id = 4,
Title = "Closing - Sale",
Level = 4,
BreadthDepth = 5
},
new ScriptHierarchy
{
IdScript_FK = 1,
ParentId = 3,
Id = 5,
Title = "Closing - No Sale",
Level = 4,
BreadthDepth = 6
}
};
model.ForEach(item => item.Children = model.Where(child => child.ParentId == item.Id).ToList());
return View(model);
}
}
}

Просмотр

Код: Выделить всё

@model List
@{
Layout = null;
}

@helper PopulateChild(HelloWorldMvcApp.ScriptHierarchy child)
{

@child.Title

if (child.Level == 2)
{
@Html.Raw("")
}

foreach (var item in child.Children)
{

@PopulateChild(item)

}
}











Hello, world!


@using (Html.BeginForm())
{

@foreach (var item in Model.Where(x => x.Level == 1))
{


@item.Title


foreach (var child in item.Children)
{
@Html.Raw("")
@PopulateChild(child)
}
}

}

Вот пример того, что я делаю
https://dotnetfiddle.net/JBLRUs
Текущий результат


Ожидаемый результат



Подробнее здесь: https://stackoverflow.com/questions/791 ... ws-columns