c# - KendoUIでツリーを作成するにはどうすればよいですか？

Question

私は現在コードを使用しています：

@foreach (var table in Model.TableData)
{
    foreach(var field in table.Fields)
    {
        var tableName = table.TableName;
        var fieldName = field;

        @(Html.Kendo().TreeView().Name("DatabaseTables").DragAndDrop(true)

        .Items(treeview =>
          {
              treeview.Add().Text(tableName).Expanded(false).Items(fields =>
              {
                  fields.Add().Text(fieldName);
              });
          }))
    }
}

これにより、テーブルごとにノードが作成され、フィールドが入力されますが、テーブルのフィールドごとに1つのツリーが作成されることは明らかです。

Answer 1

問題はあなたの入れ子です。私は通常、html ヘルパーを使用しませんが、正しい使い方は次のようになると思います。

    @(Html.Kendo().TreeView().Name("DatabaseTables").DragAndDrop(true)

    .Items(treeview =>
      {
          foreach (var table in Model.TableData)
           {
            var tableName = table.TableName;
            treeview.Add().Text(tableName).Expanded(false).Items(branch=>
            {
            foreach(var field in table.Fields)
              { 
                var fieldName = field;
                 branch.Items(fields =>
                 {
                 fields.Add().Text(fieldName);
                 });
           }});}
      }))

ツリービューの作成は for ループ内にあり、外側にある必要があります。そうしないと、反復ごとに重複するツリーが生成されます。