Readme.md

Grid View for ASP.NET MVC - Advanced master-detail view

This example demonstrates how to use a page control in a detail row template to switch between detail grids.

Overview

Define a master grid and set its SettingsDetail.ShowDetailRow property to true.

settings.SettingsDetail.ShowDetailRow = true;

Call the grid's SetDetailRowTemplateContent method and add a page control to the template.

settings.SetDetailRowTemplateContent(container => {
    var keyValue = container.KeyValue;
    ViewContext.Writer.Write("<div style='padding: 3px 3px 2px 3px'>");
    Html.RenderAction("PageControlPartial", new { key = keyValue });
    ViewContext.Writer.Write("</div>");
});

For every tab page in the page control, call its SetContent method to display the corresponding detail grid.

@Html.DevExpress().PageControl(settings => {
    settings.Name = "PageControl" + ViewData["key"];
    settings.Width = Unit.Percentage(100);
    settings.CallbackRouteValues = new { Controller = "Home", Action = "PageControlPartial", key = ViewData["key"] };
    settings.TabPages.Add("Products").SetContent(() => {
        Html.RenderAction("ProductsGridViewPartial", new { key = Model.SupplierID });
    });
    settings.TabPages.Add("Categories").SetContent(() => {
        Html.RenderAction("CategoryGridViewPartial", new { key = Model.SupplierID });
    });
    settings.TabPages.Add("Address").SetContent(() => {
        Html.RenderPartial("DetailInformation");
    });
}).GetHtml()

Files to Review

• HomeController.cs (VB: HomeController.vb)
• _MasterGridViewPartial.cshtml
• DetailPageControl.cshtml

Documentation

• Grid Templates
• Master-Detail Relationship
• Callback-Based Functionality

More Examples

• Grid View for ASP.NET Web Forms - Advanced master-detail view
• Grid View for MVC - How to implement the master-detail GridView with editing capabilities

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)