Custom Data Binding
- 4 minutes to read
In custom data bind mode, you can populate a grid’s view model with data each time the grid requests it.
Follow the steps below to use custom logic to bind the grid to data:
1. Handle Grid Data Operations
The following properties allow you to specify the grid’s route values collection to handle grid data operations (filtering, sorting, grouping, paging, etc.):
- The GridSettingsBase.CallbackRouteValues property.
- The GridViewSettings.CustomBindingRouteValuesCollection property.
Use the GridViewOperationType enumeration values to identify grid data operations.
Partial View Code:
@Html.DevExpress().GridView(
settings => {
settings.Name = "gridView";
//Handles standard grid callback requests.
settings.CallbackRouteValues = new { Controller = "MyController", Action = "MyGridViewPartial" };
//Handles grid data operations - in this sample, paging and sorting.
settings.CustomBindingRouteValuesCollection.Add(
GridViewOperationType.Paging,
new { Controller = "MyController", Action = "MyPagingAction" }
);
settings.CustomBindingRouteValuesCollection.Add(
GridViewOperationType.Sorting,
new { Controller = "MyController", Action = "MySortingAction" }
);
...
Refer to the Action Types and Passed Parameters topic for more information about the available data operation types.
2. Obtain/Update Grid State
Use the GridViewExtension.GetViewModel method to obtain the grid’s view model (GridViewModel) that stores the grid’s previous state (for example, the GridViewColumnState and the GridViewPagerState objects). The controller’s actions get the current grid state as a parameter.
Controller Code:
public partial class MyController: Controller {
public ActionResult MyGridView() {
return View("MyGridView");
}
//Standard grid callback requests
public ActionResult MyGridViewPartial() {
var viewModel = GridViewExtension.GetViewModel("gridView");
if(viewModel == null)
//Initialize the grid state on the first load
viewModel = CreateGridViewModel();
return MyCustomBindingCore(viewModel);
}
//Paging operation requests
public ActionResult MyPagingAction(GridViewPagerState pager) {
var viewModel = GridViewExtension.GetViewModel("gridView");
viewModel.ApplyPagingState(pager); //Update the grid state with the processed paging state
return MyCustomBindingCore(viewModel);
}
//Sorting operation requests
public ActionResult MySortingAction(GridViewColumnState column, bool reset) {
var viewModel = GridViewExtension.GetViewModel("gridView");
viewModel.ApplySortingState(column, reset); //Update the grid state with the processed sorting state
return MyCustomBindingCore(viewModel);
}
PartialViewResult MyCustomBindingCore(GridViewModel gridViewModel) {
... //Your code to delegate model population to Model-layer functions (see the next item)
return PartialView("MyGridViewPartial", gridViewModel);
}
static GridViewModel CreateGridViewModel() {
var viewModel = new GridViewModel();
viewModel.KeyFieldName = "ID";
viewModel.Columns.Add("From");
viewModel.Columns.Add("Subject");
viewModel.Columns.Add("Sent");
viewModel.Columns.Add("Size");
viewModel.Columns.Add("HasAttachment");
return viewModel;
}
}
See also:
3. Populate the Grid Model
In the controller, use the grid’s view model (GridViewModel) and call its GridViewModel.ProcessCustomBinding delegate method to populate the grid’s model with the requested data.
Controller Code:
public partial class MyController: Controller {
...
PartialViewResult MyCustomBindingCore(GridViewModel gridViewModel) {
//Delegate the implementation of the functions that are required for custom binding
gridViewModel.ProcessCustomBinding(
MyBindingHandlers.MyGetDataRowCount, //Function to return the total number of data rows in a model
MyBindingHandlers.MyGetData //Function to return data rows requested by the grid
);
return PartialView("MyGridViewPartial", gridViewModel);
}
}
Model Code:
...
public static class MyBindingHandlers {
static IQueryable Model { get { return LargeDatabaseDataProvider.Emails; } }
public static void MyGetDataRowCount(GridViewCustomBindingGetDataRowCountArgs e) {
e.DataRowCount = Model.Count(); //Return the total count of data rows in your model (taking into account the applied filters)
}
public static void MyGetData(GridViewCustomBindingGetDataArgs e) {
e.Data = Model
.ApplySorting(e.State.SortedColumns) //The function used to sort a model
.Skip(e.StartDataRowIndex) //Position on the first required data row
.Take(e.DataRowCount); //Get the number of data rows (the current page's rows)
}
...
}
...
See also:
4. Bind the Grid to the Populated Model
In the controller, pass the populated grid’s model as a model to the grid’s Partial View. In the Partial View, use the GridViewExtension.BindToCustomData method to bind the grid to the passed model.
Important
Make sure that you override the default model binder with the DevExpressEditorsBinder in the Global.asax file. The DevExpress implementation of the model binder allows editors in the Grid View to transfer values back to the data model. Refer to the following topic for more information: Binding Data Editors to Data.
Controller Code:
public partial class MyController: Controller {
...
public ActionResult MyGridViewPartial() {
...
return MyCustomBindingCore(viewModel);
}
public ActionResult MyPagingAction(GridViewPagerState pager) {
...
return MyCustomBindingCore(viewModel);
}
public ActionResult MySortingAction(GridViewColumnState column, bool reset) {
...
return MyCustomBindingCore(viewModel);
}
PartialViewResult MyCustomBindingCore(GridViewModel gridViewModel) {
...
return PartialView("MyGridViewPartial", gridViewModel);
}
...
}
Partial View Code:
@Html.DevExpress().GridView(
settings => {
settings.Name = "gridView";
...
}).BindToCustomData(Model).GetHtml()
Related Documentation
- Action Types and Passed Parameters
- Methods to Update the Grid State in Actions
- ProcessCustomBinding - Available Binding Delegates
- Implementation of Typed Method Delegates
- Custom Binding Limitations