Telerik Kendo MVC 5 Master detail grid

У меня есть код, который отображает всех сотрудников в Kendo Grid. Теперь в этом примере предположим, что я хочу отобразить имя и возраст члена семьи сотрудника в подробной сетке ниже каждой строки сотрудника. Как я могу это сделать? Я попробовал посмотреть веб-сайт Telerik, но я не могу понять. Пожалуйста посоветуй. Благодарю.Telerik Kendo MVC 5 Master detail grid

Модель

public class Emp 
    { 
     public int EmpID{ get; set; } 
     public string FirstName{ get; set; } 
     public string LastName { get; set; } 
    } 

public class EmpFamily 
    { 
     public int EmpID{ get; set; } 
     public string Name{ get; set; } 
     public int Age { get; set; } 
    }

Контроллер

public ActionResult Index(string SearchString) 
    { 
     var EmpRows = from S in db.Emp 
         select S; 

     List<EmpRec> EmpList = new List<EmpRec>(); 
     foreach (Disk EmpRow in EmpRows) 
     { 
      EmpRec e = new EmpRec(); 

      e.EmpID = EmpRow.EmpID; 
      e.FirstName = EmpRow.FirstName; 
      e.LastName = EmpRow.LastName ; 
      EmpList.Add(e); 
     } 
     return View(EmpList); 
    }

Посмотреть

@model IEnumerable<TestProj.Models.EmpRec> 
@using (Html.BeginForm()) 
{ 

} 

@(Html.Kendo().Grid(Model) 
     .Name("kGrid") 
     .Pageable() 
     .Columns(columns => 
     { 
      columns.Bound(p => p.EmpID).Filterable(true).Title("ID"); 
      columns.Bound(p => p.FirstName).Title("First Name"); 
      columns.Bound(p => p.LastName).Title("Last Name "); 
     }) 
     .Navigatable() 
     .DataSource(datasource => datasource 
      .Ajax() 
      .PageSize(15) 
      .ServerOperation(false) 

     ) 
)

источник

2016-01-22 ary

Вы должны добавить шаблон ребенка к у наша сетка, которая будет отбираться от ключа из вашей родительской сетки.

@(Html.Kendo().Grid(Model) 
     .Name("kGrid") 
     .Pageable() 
     .Columns(columns => 
     { 
      columns.Bound(p => p.EmpID).Filterable(true).Title("ID"); 
      columns.Bound(p => p.FirstName).Title("First Name"); 
      columns.Bound(p => p.LastName).Title("Last Name "); 
     }) 
     .Navigatable() 
     .DataSource(datasource => datasource 
      .Ajax() 
      .PageSize(15) 
      .ServerOperation(false) 

     ) 
     .ClientDetailTemplateId("tmpGridDetail") 
) 


<script id="tmpGridDetail" type="text/kendo-tmpl"> 
     <div id="tabStripDetails"> 
      @(Html.Kendo().TabStrip().HtmlAttributes(new { @Class = "tabStrip" }) 
       .Name("tsDetail_#=SomParentGridID#") 
       .Animation(animation => 
       { 
        animation.Enable(true); 
        animation.Open(config =>{config.Fade(FadeDirection.In); 
       }); 
       }) 
       .Items(items => 
       { 
        items.Add().Text("Summary").LoadContentFrom(@Url.Action("SomePartialView1", "SomeController") + "?someID=#=SomeParentGridID#"); 
        items.Add().Text("Detail").LoadContentFrom(@Url.Action("SomePartialView1", "SomeController")+"?someID=#=SomeParentGridID#"); 
       }) 
       .SelectedIndex(0)  
       .ToClientTemplate() 
      ) 
     </div> 
    </script>

Я не пример с сеткой в деталях, однако, вы могли бы заменить шаблон ниже с KendoGrid. Несколько ключевых моментов: квалификатор #=SomeField# позволяет читать данные родительских сеток и применять его в шаблоне. Кроме того, должен быть вызван .ToClientTemplate() в конфигурации вашей сетки, если он должен быть клиентским шаблоном или дочерней сеткой. Важно отметить, что вы должны убедиться, что все дочерние элементы имеют уникальные имена. Обычно это делается с использованием родительского уникального ключа в имени элемента (ов). Если ваш EmpID является уникальным идентификатором всех элементов в родительской сетке, вы можете назвать все элементы управления в шаблоне, например .Name("grdChild_#EmpID");

источник

2016-01-26 20:43:39

Вы должны использовать иерархическую сетку. Это ясно объясняется в этой демонстрации. Попробуйте это и посмотрите, сталкиваетесь ли вы с какими-либо проблемами и дайте мне знать. Я пробовал в своем приложении, и он работал хорошо.

Grid/Hierarchy

источник

2016-02-03 22:28:22

Telerik Kendo MVC 5 Master detail grid

ответ

Смежные вопросы