Skip to content

Instantly share code, notes, and snippets.

@dearcodes
Created September 12, 2014 20:39
Show Gist options
  • Save dearcodes/e47cafe00e7cc2e027d4 to your computer and use it in GitHub Desktop.
Save dearcodes/e47cafe00e7cc2e027d4 to your computer and use it in GitHub Desktop.
ejemplo grilla con detalle
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.EmployeeViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(e => e.FirstName).Width(120);
columns.Bound(e => e.LastName).Width(120);
columns.Bound(e => e.Country).Width(120);
columns.Bound(e => e.City).Width(120);
columns.Bound(e => e.Title);
})
.Sortable()
.Pageable()
.Scrollable()
.ClientDetailTemplateId("template") //aqui se agrega la referencia al id de la plantilla del detalle
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("HierarchyBinding_Employees", "Grid"))
)
.Events(events => events.DataBound("dataBound"))
)
<script id="template" type="text/kendo-tmpl">
@(Html.Kendo().TabStrip()
.Name("tabStrip_#=EmployeeID#")
.SelectedIndex(0)
.Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
.Items(items =>
{
items.Add().Text("Orders").Content(@<text>
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("grid_#=EmployeeID#")
.Columns(columns =>
{
columns.Bound(o => o.OrderID).Title("ID").Width(56);
columns.Bound(o => o.ShipCountry).Width(110);
columns.Bound(o => o.ShipAddress);
columns.Bound(o => o.ShipName).Width(190);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("HierarchyBinding_Orders", "Grid", new { employeeID = "#=EmployeeID#" }))
)
.Pageable()
.Sortable()
.ToClientTemplate())
</text>
);
items.Add().Text("Contact Information").Content(
"<div class='employee-details'>" +
"<ul>" +
"<li><label>Country:</label>#= Country #</li>" +
"<li><label>City:</label>#= City #</li>" +
"<li><label>Address:</label>#= Address #</li>" +
"<li><label>Home Phone:</label>#= HomePhone #</li>" +
"</ul>" +
"</div>"
);
})
.ToClientTemplate())
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment