I am trying to create a master/detail grid using this example Kendo Dojo. It seemed to work fine as both grids are receiving data. However, when I expand the detail grid the rows do not display. If you see the example below, TagID #1 has a record count of 1 detail row that should display but it doesnt'. It only shows like a white space, whereas TagID #22 which does not have any detail records shows a record count of 0 and a completely empty grid.
Here is my HTML:
<div kendo-grid="tagsGrid" options="tagsGridOptions">
<div k-detail-template>
<kendo-tabstrip>
<ul>
<li class="k-state-active">Tagged Contractors</li></ul>
<div>
<div kendo-grid k-options="detailGridOptions(dataItem)"></div>
</div></kendo-tabstrip></div>
</div>
Here is my Angular Controller Code for the detail grid:
$scope.detailGridOptions = function (dataItem)
{return
{ dataSource:
{ type: 'aspnetmvc-ajax', transport:
{ read: "/Home/GetTaggedContractorsByMajor"},
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 5,
filter: { field: "TagID", operator: "eq", value: dataItem.TagID },
schema: { data: "Data", total: "Total"}},
scrollable: false,
sortable: true,
pageable: true,
columns: [{ field: "CompanyID", title: "CompanyID"},{ field: "vchCompanyName", title: "Company Name"}]};};
I didn't include the code for the master grid for brevity, but if anyone feels they need it in order to help, I will gladly add it.