This is a migrated thread and some comments may be shown as answers.

[Solved] reference detail grid

1 Answer 172 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Phani
Top achievements
Rank 1
Phani asked on 10 Dec 2014, 08:21 PM
Hello, 

I have a hierarchical grid with 2 hierarchies, Projects>Requests>Jobs. Jobs grid has a checkbox column. Users should be able to select multiple jobs from multiple requests/projects. I need to loop through the jobs grids and get the selected jobIds. How can accomplish this? Thanks!


Here is how the grid is defined
@(Html.Kendo().Grid<ViewProject>()
          .Name("Projects")
          .Columns(columns =>
              {
                  columns.Bound(m => m.ProjectId).Visible(false);
                  columns.Bound(m => m.ProjectNumber).Width(120);
                  columns.Bound(m => m.ProjectName).Width(125);
                  columns.Bound(m => m.CustomerNumber).Width(125);
                  columns.Bound(m => m.CustomerName).Width(125);
                  columns.Bound(m => m.Division).Width(100);
                  columns.Bound(m => m.DueDate).ClientTemplate("#= kendo.toString(DueDate, 'MM/dd/yyyy') #").Width(90);
                  columns.Bound(m => m.CreatedBy).Width(90);
                  columns.Bound(m => m.CreatedDate).ClientTemplate("#= kendo.toString(CreatedDate, 'MM/dd/yyyy') #").Width(90);
                  columns.Bound(m => m.UpdatedBy).Width(90);
                  columns.Bound(m => m.UpdatedDate).ClientTemplate("#= kendo.toString(UpdatedDate, 'MM/dd/yyyy') #").Width(90);
              })
 
 .Sortable()
 .Pageable()
 .Scrollable()
 .ClientDetailTemplateId("template")
 .AutoBind(false)
 .DataSource(dataSource => dataSource
 .Ajax()
 .PageSize(20)
 .Batch(true)
 .ServerOperation(false)
 .Model(model => model.Id(p => p.ProjectNumber))
 .Read(read=>read.Action("ReadData","SummingeReports")
 .Data("ReadData"))
 )
 
     )
          <script id="template" type="text/kendo-tmpl">
   @(Html.Kendo().Grid<ViewRequest>()
           .Name("Requests_#=ProjectNumber#")
           .Columns(columns =>
           {
               columns.Bound(o => o.RequestID).Width(150).ClientTemplate("<a href='javascript:showJob(\\#=RequestID\\#)'>\\#=RequestID\\#</a>");
               columns.Bound(o => o.RequestName).Width(110);
               columns.Bound(o => o.Description).Width(110);
               columns.Bound(o => o.CreatedBy).Width(110);
               columns.Bound(o => o.CreatedDate).Width(110).ClientTemplate("\\#= kendo.toString(CreatedDate, 'MM/dd/yyyy') \\#"); ;
               columns.Bound(o => o.UpdatedBy).Width(200);
               columns.Bound(o => o.UpdatedDate).Width(200).ClientTemplate("\\#= kendo.toString(UpdatedDate, 'MM/dd/yyyy') \\#");
           })
           .DataSource(dataSource => dataSource
               .Ajax()
               .PageSize(10)
               .Model(model => model.Id(p => p.RequestID))
               .Read(read => read.Action("GetProjectRequests", "SummingeReports", new { projectId = "#=ProjectId#" })
               .Data("ReadData"))
           )
           .Pageable()
           .ClientDetailTemplateId("jobstemplate")
           .Sortable()
           .ToClientTemplate()
   )
              </script>
                <script id="jobstemplate" type="text/kendo-tmpl">
   @(Html.Kendo().Grid<ViewJob>()
           .Name("Jobs_#=RequestID#")
           .Columns(columns =>
           {
               columns.Template(@<text></text>).ClientTemplate("<input type='checkbox' \\#= Select ? checked='checked':'' \\# class='chkbx' />")
                  .HeaderTemplate("<input type='checkbox' id='masterCheckBox' onclick='checkAll(this, #=RequestID#)'/>").Width(30);
               columns.Bound(o => o.JobNumber).Width(150).ClientTemplate("<a href='javascript:showJob(\\#=JobNumber\\#)'>\\#=JobNumber\\#</a>");
               columns.Bound(o => o.JobName).Width(110);
               columns.Bound(o => o.Status).Width(110);
               columns.Bound(o => o.SubmittedBy).Width(110);
               columns.Bound(o => o.SubmitDate).Width(110).ClientTemplate("\\#= kendo.toString(SubmitDate, 'MM/dd/yyyy') \\#");
               columns.Bound(o => o.Division).Width(200);
               columns.Bound(o => o.ProjectNumber).Width(200);
           })
               .DataSource(dataSource => dataSource
                   .Ajax()
                   .PageSize(10)
                   .Model(model => model.Id(p => p.JobNumber))
                   .Read(read => read.Action("GetRequestJobs", "SummingeReports", new { requestID = "#=RequestID#" }))
               )
               .Pageable()
               .Sortable()
               .ToClientTemplate()
       )

1 Answer, 1 is accepted

Sort by
0
Accepted
Dimiter Madjarov
Telerik team
answered on 11 Dec 2014, 04:36 PM
Hello Phani,


You could use the following or similar CSS selector to retrieve the third level Grid elements.
E.g.
var grid = $("#Projects").data("kendoGrid");
var thirdLevelGrids = grid.tbody.find(".k-detail-cell .k-detail-cell>.k-grid");

After this, the approach for retrieving the selected rows is the same as in any Kendo UI Grid.

Regards,
Dimiter Madjarov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Phani
Top achievements
Rank 1
Answers by
Dimiter Madjarov
Telerik team
Share this question
or