[Solved] MVC Grid Detailview Tabstrip Razor

[Captain Awesome]

I have an MVC Grid that contains a Detailview. In the detail view I am attempting to add a Tabstrip. I amusing the razor view engine.

The tab strip shows up in the View before the Grid. In other words as you look down the page you see a tab strip and then the Grid (please see attached screenshot)

The Tabstrips have uniqueID's in the DOM when the page is rendered.

Any ideas?

 

 

 

 

@(Html.Telerik().Grid(Model)
       .Name("Dockets")
       .Columns(columns =>
       {
               columns.Bound(e => e.FirstName);
               columns.Bound(e => e.LastName);
       })
       .DetailView(detailView => detailView.Template(e => // Set the server template
       {
           Html.Telerik().TabStrip()
               .Name("TabStrip_" + e.CitationViolationID)
               .SelectedIndex(0)
               .Items(items =>
               {
                items.Add().Text("Summary").Content(
                    @<label>Summary</label>
                );
                items.Add().Text("Payment").Content(
                    @<label>Payment</label>
                );
                })
                .Render();
        }))
       .RowAction(row =>
       {
               // Expand initially the detail view of the first row
               if (row.Index == 0)
               {
                   row.DetailRow.Expanded = true;
               }
       })
       .Pageable()
    )

[Petur Subev]

Hello Mike,

To make things work you should not render the template directly to the output.
I suggest you to use the lambda expression approach shown below (instead of the @<text></text> approach), because Razor does not support nested @<text> statements.

.DetailView(detailView => detailView.Template(e => // Set the server template
       {
           return Html.Telerik().TabStrip()
               .Name("TabStrip_" + e.PersonID)
               .SelectedIndex(0)
               .Items(items =>
               {
                items.Add().Text("Summary").Content(
                    @<label>Summary</label>
                );
                items.Add().Text("Payment").Content(
                    @<label>Payment</label>
                );
                })
                .ToHtmlString();
        }))

 Kind regards,
Petur Subev
the Telerik team