[Solved] Grid -> DetailsView(TabStrip) -> Tab 2(Sub Grid)

[Keith]

I have the following grid definition:

<% Html.Telerik().Grid<VmProcurementAction>() // (Model.ProcurementActions) //
       .Name("ProcurementActionGrid")
       .DetailView(details => details.ClientTemplate(
           Html.Telerik()
               .TabStrip()
               .Name("TabStrip_<#= Id #>")
               .SelectedIndex(0)
               .Items(items =>
                   {
                       items.Add().Text("Additional Info").Content(
                           "<table>" +
                           "<tr>" +
                           "<td style='vertical-align: top'>" +
                           "<b>Summary Description:</b><br/><#= SummaryDescription #>" +
                           "</td>" + {Removed For Brevity}
                           "</tr>" +
                           "</table>"
                           );
                       items.Add().Text("Procurement Action Activity Dates").Content(
                           "<br/><input type='checkbox' disabled='disabled' name='AwaitingProcurementPackEnabled' <#= AwaitingProcurementPackEnabled ? checked='checked' : '' #> /> <b>Awaiting Procurement pack from Point of Contact</b><br/>" +
                           Html.Telerik()
                               .Grid<VmProcurementActivity>()
                               .Name("ActionGrid_<#= Id #>")
                               .Footer(false)
                               .Columns(c =>
                                   {
                                       c.Command(commands => commands.Edit().ButtonType(GridButtonType.Image)).Title("Actions").Width(75);
                                       c.Bound(e => e.ActivityId).Visible(true).Width(0);
                                       c.Bound(e => e.ParentId).Visible(true).Width(0);
                                       c.Bound(e => e.Activity).ReadOnly(true);
                                       c.Bound(e => e.OriginalPlannedDate).Format("{0:MM/dd/yyyy}").ReadOnly(true).Width(130);
                                       c.Bound(e => e.CurrentPlannedDate).Format("{0:MM/dd/yyyy}").Width(130);
                                       c.Bound(e => e.ActualDate).Format("{0:MM/dd/yyyy}").Width(130);
                                       c.Bound(e => e.ReasonForDateChange).Title("Date Change Reason").HtmlAttributes(new { id = "tdReasonForDateChange_<#= item.ActivityId #>" });
                                       c.Bound(e => e.ReasonForDateChangeId).Title("Date Change Reason DDL").Width(0).HtmlAttributes(new { id = "tdReasonForDateChangeId_<#= item.ActivityId #>" });
                                   })
                               .DataBinding(dataBinding =>
                                            dataBinding.Ajax()
                                                       .Select("AjaxActionDatesGetFor", "ProcurementActions", new {procurementActionId = "<#= Id #>"})
                                                       .Update("AjaxActionDateUpdateFor", "ProcurementActions", new { procurementActionId = "<#= Id #>", parentId = "<#= ParentProcurementActionId #>", activityId = "<#= Id #>" })
                                                       .Enabled(true)
                               )
                               .ClientEvents(events =>
                                   {
                                       events.OnEdit("onActionGridRowEdit");
                                       events.OnSave("onActionGridRowSave");
                                   })
                               .Editable(editing => editing.Mode(GridEditMode.InLine))
                               .DataKeys(keys => keys.Add(c => c.ActivityId))
                               .Selectable()
                               .ToHtmlString()
                           );
                   })
               .ToHtmlString()
                                  ))
       .ToolBar(commands =>
           {
               if (Model.IsRegularOrPocAdmin)
               {
                   commands.Insert().ButtonType(GridButtonType.ImageAndText);
               }
           })
       .Columns(c =>
           {
               c.Command(commands =>
                   {
                       commands.Edit().ButtonType(GridButtonType.ImageAndText).HtmlAttributes(new {style = "color: black"});
                       if (Model.IsRegularOrPocAdmin)
                       {
                           commands.Delete().ButtonType(GridButtonType.ImageAndText).HtmlAttributes(new {style = "color: black"}); //.HtmlAttributes(new { "<#= IsPocAdmin ? 'hidden' : '' #>" });
                       }
                       commands.Custom("showHistory")
                               .ButtonType(GridButtonType.ImageAndText)
                               .Text("History")
                               .Action("Show", "ProcurementActions")
                               .DataRouteValues(route => route.Add(o => o.Id).RouteKey("id"))
                               .HtmlAttributes(new {style = "color: black"});
                   }).Title("Actions").Width(100);
               c.Bound(e => e.Id).Visible(false);
               c.Bound(e => e.ActionId).Visible(false);
               c.Bound(e => e.ActionId).Title("Action Id").Width(80);
               c.Bound(e => e.ContractNumber).HtmlAttributes(new {style = "vertical-align: top"});
           })
       .ClientEvents(events =>
           {
               events.OnEdit("onEditOrInsert");
               events.OnError("onError");
               events.OnSave("onSave");
           })
       .DataKeys(keys => keys.Add(o => o.Id))
       .DataBinding(dataBinding => dataBinding.Ajax()
                                              .OperationMode(GridOperationMode.Client)
                                              .Select("AjaxGetAll", "ProcurementActions")
                                              .Insert("AjaxInsert", "ProcurementActions")
                                              .Update("AjaxUpdate", "ProcurementActions")
                                              .Delete("AjaxDelete", "ProcurementActions")
                                              .Enabled(true))
       .Editable(editing =>
                 editing.Mode(GridEditMode.PopUp)
                        .TemplateName("EditProcurementAction")
                        .FormHtmlAttributes(new {style = "top: 0px; left: 250px; width: 1100px;"})
                        .InsertRowPosition(GridInsertRowPosition.Top)
       )
       .Pageable(paging => paging.PageSize(100, new int[]{5, 10, 25, 50, 100, 250, 500, 1000}).Position(GridPagerPosition.Bottom).Style(GridPagerStyles.NextPreviousAndDropDown | GridPagerStyles.Numeric))  //pageSize
       .Scrollable(scrolling => scrolling.Height(500))
       .Filterable()
       .Sortable()
       .Groupable()
       .Render();
    %>

In the sub grid (2nd tab in the tab strip) I have ".Grid<VmProcurementActivity>()".  Now, I am trying to get the ActivityId from this List<VmProcurementActivity> object and put it in "c.Bound(e => e.ReasonForDateChange).Title("Date Change Reason").HtmlAttributes(new
{ id = "tdReasonForDateChange_<#= item.ActivityId #>" });".

How do I do this utilizing AJAX binding - it should bind when the details view is opened.  ActivityId is always in the set 1-12.  In lieu of using ActivityId is there a way to use an incrementing variable/value?

[Petur Subev]

Hello Keith,

It is not possible to use client expressions inside of the HtmlAttributes option. You can consider using the RowDataBound event and add the attributes to the cell manually with JavaScript. Inside the row dataBound event you have reference to the row and the dataItem related to that row.

Regards,
Petur Subev
Telerik