Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]ASP.NET WebForms Controls
 [Collapse]ASP.NET MVC Extensions
  [Expand]Product Information
  [Expand]Getting Started
  [Expand]Common Concepts
  [Collapse]Grid View
    Overview - GridView
    Main Features - GridView
   [Expand]Concepts
   [Expand]Visual Elements
   [Collapse]Examples
     How to: Implement Custom Data Binding with Paging and Sorting
     How to: Implement a Custom Binding Scenario for Two GridViews Used in a Master-Detail Relationship
  [Expand]Card View
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]HTML Editor
  [Expand]Image and Data Browsing
  [Expand]Docking and Popups
  [Expand]Navigation and Layout Extensions
  [Expand]File Management
  [Expand]Multi-Use Site Extensions
  [Expand]Charts
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Tree List
  [Expand]Data Editor Extensions
  [Expand]Report Extensions
  [Expand]SpellChecker
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

How to: Implement a Custom Binding Scenario for Two GridViews Used in a Master-Detail Relationship

Show Me

A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=E4398.

This sample demonstrates how to manually provide data for two GridView extensions that are used in a master-detail relationship. In this implementation, only sorting and paging operations of the grids are handled in the corresponding Action methods.

To learn more on the GridView's custom data binding feature, please refer to the Custom Data Binding - Overview help topic.

Note that this sample provides a universal implementation approach. It can be easily adopted and used for every custom data source object if it implements the IQueryable interface.

The common logic of each grid's custom binding implementation is similar to the implementation demonstrated by the E4394 code sample. The difference is that in this sample, the master grid's detail row template is defined by using another (detail) GridView extension. Each detail grid instance is provided with information on the corresponding master row's key field value. This value is passed to a detail grid's Action methods (as a parameter) and to the grid's Partial View (as a ViewData object).

In short, this sample's implementation logic is as follows:

  • In both grid Partial Views (see MasterGridViewPartial.cshtml and DetailGridViewPartial.cshtml in Views > Home), a grid's GridViewSettings.CustomBindingRouteValuesCollection property is used to define handling actions for sorting and paging operations; the GridSettingsBase.CallbackRouteValues property defines the action to handle all other (standard) grid callbacks. In the master grid's Partial View, the GridViewSettings.SetDetailRowTemplateContent method delegate is implemented to define detail row content and provide it with the master row's key field value - the value of the "CustomerID" column. In the detail grid's Partial View, the received corresponding master row key field value (the value of the "CustomerID" column) is passed to the specified actions.

  • In the Controller (Controller > HomeController.cs), the specified Action methods are implemented for both grids to update a specific grid view model object (GridViewModel that maintains a grid's state) with information of the performed operation (if required). Then, a grid view model's GridViewModel.ProcessCustomBinding method is called to delegate a binding implementation to specific model-layer methods indicated by specific parameters of the method.

  • At the Model layer (see MasterCustomBindingModel.cs and DetailCustomBindingModel.cs in Models), two specified delegates are implemented for each grid to populate the corresponding grid view model with the required data. Generally, in the provided implementation of model-level binding delegates, you just need to modify a single code line in each model file to point to your particular model object that implements the IQueryable interface:

  • Finally, the resulting grid view model object is passed from the Controller to a particular grid's Partial View as a Model. For a detail grid, the master row key value is also passed to the Partial View as a ViewData object. In the Partial View, each grid binds to the Model via the GridViewExtension.BindToCustomData method.

How would you rate this topic?​​​​​​​