This example illustrates how to implement the master detail GridView with editing capabilities.
Perform the following steps to define the master-detail layout:
1) Define both master and detail GridView settings within separate PartialView files (see the Using Callbacks);
2) Set the master grid's SettingsDetail.ShowDetailRow property to "True";
3) Define the master grid's DetailRow content via the SetDetailRowTemplateContent method and render the detail grid's PartialView inside.
Note:
Values passed in a detail grid's CallbackRoute must have a unique name and must not replicate any other names on a page: Q577974: GridView - "The parameters dictionary contains a null entry for parameter 'id' of non-nullable type 'System.Int32'" error occurs when canceling editing in the detail GridView
See also:
GridView - Advanced Master-Detail View
A simple example of master-detail grids with editing capabilities
Question Comments
Added By: Wilson Vargas at: 10/20/2012 12:08:04 PM
This sample not compile!
settings.DataBinding = (sender, e) => {
((MVCxGridView)sender).ForceDataRowType(typeof(DevExpress.Razor.Models.Person));
Excellent - just what I needed!
Added By: Paul Astro at: 8/27/2014 12:21:12 PMHello Support,
Is there a ASP.NET version for this exact same example? Please supply URL link...... thanks.
Added By: Anthony (DevExpress Support) at: 8/27/2014 11:49:39 PM Hello,Please refer to the A simple example of master-detail grids with editing capabilities example.Added By: venu koneru at: 4/15/2015 12:06:30 PM
The below code is the master page partial view
@{
var grid = Html.DevExpress().GridView(settings => {
settings.Name = "GridViewptconfig";
settings.CallbackRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialptconfig" };
//settings.SettingsEditing.AddNewRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialptconfigAddNew" };
//settings.SettingsEditing.UpdateRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialptconfigUpdate" };
//settings.SettingsEditing.DeleteRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialptconfigDelete" };
//settings.SettingsEditing.Mode = GridViewEditingMode.EditFormAndDisplayRow;
//settings.SettingsBehavior.ConfirmDelete = true;
//settings.CommandColumn.Visible = true;
//settings.CommandColumn.ShowNewButton = true;
//settings.CommandColumn.ShowDeleteButton = true;
//settings.CommandColumn.ShowEditButton = true;
settings.KeyFieldName = "ptConfigId";
settings.SettingsPager.Visible = true;
settings.Settings.ShowGroupPanel = false;
settings.Settings.ShowFilterRow = false;
settings.SettingsBehavior.AllowSelectByRowClick = false;
settings.SettingsBehavior.AllowSort = false;
settings.SettingsDetail.ShowDetailRow = true;
settings.SettingsDetail.AllowOnlyOneMasterRowExpanded = true;
settings.SetPreviewRowTemplateContent(c =>
Html.RenderAction("GridViewPartialResult",
new { MasterId = DataBinder.Eval(c.DataItem, "ptConfigId") }));
settings.Columns.Add("ptConfigId");
settings.Columns.Add("ptProductId");
settings.Columns.Add("freq");
settings.Columns.Add("volt");
settings.Columns.Add("sens");
settings.Columns.Add("ppk");
});
if (ViewData["EditError"] != null){
grid.SetEditErrorText((string)ViewData["EditError"]);
}
}
@grid.Bind(Model).GetHtml()
The below code is the detail page view
-------------------------------------------------
@{
var grid = Html.DevExpress().GridView(settings => {
settings.Name = "GridViewResult";
settings.CallbackRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialResult" };
settings.SettingsEditing.AddNewRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialResultAddNew" };
settings.SettingsEditing.UpdateRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialResultUpdate" };
settings.SettingsEditing.DeleteRowRouteValues = new { Controller = "PTTEST", Action = "GridViewPartialResultDelete" };
settings.SettingsEditing.Mode = GridViewEditingMode.EditFormAndDisplayRow;
settings.SettingsBehavior.ConfirmDelete = true;
settings.CommandColumn.Visible = true;
settings.CommandColumn.ShowNewButton = true;
settings.CommandColumn.ShowDeleteButton = true;
settings.CommandColumn.ShowEditButton = true;
settings.KeyFieldName = "ptConfigId";
settings.SettingsPager.Visible = true;
settings.Settings.ShowGroupPanel = true;
settings.Settings.ShowFilterRow = true;
settings.SettingsBehavior.AllowSelectByRowClick = true;
settings.SettingsDetail.MasterGridName = "GridViewptconfig";
settings.Columns.Add("ptConfigId");
settings.Columns.Add("fesample");
settings.Columns.Add("feresult");
settings.Columns.Add("nfesample");
settings.Columns.Add("nferesult");
settings.Columns.Add("sssample");
settings.Columns.Add("ssresult");
});
if (ViewData["EditError"] != null){
grid.SetEditErrorText((string)ViewData["EditError"]);
}
}
@grid.Bind(Model).GetHtml()
Are the Master detail code correct.
Added By: Alessandro (DevExpress Support) at: 4/15/2015 12:26:42 PMHello,
To process your recent post more efficiently, I created a separate ticket on your behalf: T231079: GridView - Master-Detail implementation. This ticket is currently in our processing queue. Our team will address it as soon as we have any updates.