Example E3251
Visible to All Users

Grid View for ASP.NET Web Forms - How to implement common scenarios within a grid bound with Entity Framework 6

This example demonstrates how to bind ASPxGridView with Entity Framework 6 and implement common scenarios: CRUD operations, a master-detail grid, a lookup column, and server mode.

Implementation Details

CRUD Operations

Follow the steps below to enable CRUD operations in ASPxGridView.

Insert a Row

  1. Handle the RowInserting event.
  2. Create a DataContext instance.
  3. Create a new data item and fill its properties from the e.NewValues dictionary.
  4. Add a new data item to the corresponding table.
  5. Save changes.
  6. Set the e.Cancel property to true to cancel the operation.
  7. Call the CancelEdit method to close the edit form.
HTML
<dx:ASPxGridView ID="grid" runat="server" KeyFieldName="ProductID" OnRowInserting="grid_RowInserting" ...>
C#
public Model1 DataContext { ... } protected void grid_RowInserting(object sender, DevExpress.Web.Data.ASPxDataInsertingEventArgs e) { var product = new Product(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; DataContext.Products.Add(product); DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); }

Edit a Row

  1. Handle the RowUpdating event.
  2. Create a DataContext instance.
  3. Use the e.Keys property to get the processed data item.
  4. Edit data item properties.
  5. Save changes.
  6. Set the e.Cancel property to true to cancel the operation.
  7. Call the CancelEdit method to close the edit form.
HTML
<dx:ASPxGridView ID="grid" runat="server" KeyFieldName="ProductID" OnRowUpdating="grid_RowUpdating" ...>
C#
public Model1 DataContext { ... } protected void grid_RowUpdating(object sender, DevExpress.Web.Data.ASPxDataUpdatingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); }

Delete a Row

  1. Handle the RowDeleting event.
  2. Create a DataContext instance.
  3. Use the e.Keys property to get the processed data item.
  4. Remove the data item.
  5. Save changes.
  6. Set the e.Cancel property to true to cancel the operation.
HTML
<dx:ASPxGridView ID="grid" runat="server" KeyFieldName="ProductID" OnRowDeleting="grid_RowDeleting" ...>
C#
public Model1 DataContext { ... } protected void grid_RowDeleting(object sender, DevExpress.Web.Data.ASPxDataDeletingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); DataContext.Products.Remove(product); DataContext.SaveChanges(); e.Cancel = true; }

Files to Review

Master-Detail Layout

  1. Place an ASPxGridView control in the DetailRow grid template to create a master-detail grid layout.
  2. Handle the detail grid's Init event to bind the grid. Call the GetMasterRowKeyValue method to get the current master row's key value.
HTML
<dx:ASPxGridView ID="gridMaster" runat="server" AutoGenerateColumns="False" OnDataBinding="gridMaster_DataBinding" KeyFieldName="CategoryID"> <Columns> ... </Columns> <Templates> <DetailRow> <dx:ASPxGridView ID="gridDetail" runat="server" AutoGenerateColumns="False" OnInit="gridDetail_Init" KeyFieldName="ProductID"> <Columns> <dx:GridViewDataTextColumn FieldName="ProductID" > <EditFormSettings Visible="False" /> </dx:GridViewDataTextColumn> <dx:GridViewDataTextColumn FieldName="ProductName" /> <dx:GridViewDataTextColumn FieldName="UnitPrice" /> <dx:GridViewDataCheckColumn FieldName="Discontinued" /> </Columns> </dx:ASPxGridView> </DetailRow> </Templates> <SettingsDetail ShowDetailRow="true" /> </dx:ASPxGridView>
C#
protected void gridMaster_DataBinding(object sender, EventArgs e) { gridMaster.ForceDataRowType(typeof(Category)); gridMaster.DataSource = DataContext.Categories.ToList(); } protected void gridDetail_Init(object sender, EventArgs e) { ASPxGridView grid = sender as ASPxGridView; int masterKey = (int)grid.GetMasterRowKeyValue(); grid.DataSource = DataContext.Products.Where(p => p.CategoryID == masterKey).ToList(); grid.DataBind(); }

Files to Review

Lookup Column

Add a column of the GridViewDataComboBoxColumn type in the Columns collection to create a lookup column in the grid. Bind the column to a data source in the Page_Init event.

HTML
<dx:ASPxGridView ID="grid" runat="server" AutoGenerateColumns="False" KeyFieldName="ProductID" ...> <Columns> ... <dx:GridViewDataComboBoxColumn Caption="Category" FieldName="CategoryID" > <PropertiesComboBox TextField="CategoryName" ValueField="CategoryID" ValueType="System.Int32" /> </dx:GridViewDataComboBoxColumn> </Columns> </dx:ASPxGridView>
C#
protected void Page_Init(object sender, EventArgs e) { ((GridViewDataComboBoxColumn)grid.DataColumns["CategoryID"]).PropertiesComboBox.DataSource = DataContext.Categories.ToList(); }

Files to Review

Server Mode

Use the EntityServerModeDataSource component to bind the ASPxGridView control to a data source with the Entity Framework, and enable database server mode.

HTML
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ServerModeEF.aspx.cs" Inherits="GridEntityFramework.ServerModeEF" %> <dx:ASPxGridView ID="grid" runat="server" AutoGenerateColumns="False" KeyFieldName="ProductID" OnDataBinding="grid_DataBinding"> <Columns> ... </Columns> </dx:ASPxGridView>
C#
protected void grid_DataBinding(object sender, EventArgs e) { (sender as ASPxGridView).DataSource = GetEntityServerModeSource(); } private EntityServerModeSource GetEntityServerModeSource() { EntityServerModeSource esms = new EntityServerModeSource(); esms.QueryableSource = DataContext.Products; esms.KeyExpression = "ProductID"; return esms; }

Files to Review

Files to Review

Documentation

More Examples

Example Code

GridEntityFramework/CustomEditingCapabilities.aspx
ASPx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CustomEditingCapabilities.aspx.cs" Inherits="GridEntityFramework.CustomEditingCapabilities" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Custom Editing Capabilities</title> </head> <body> <form id="form1" runat="server"> <div> <dx:ASPxGridView ID="grid" runat="server" KeyFieldName="ProductID" OnDataBinding="grid_DataBinding" OnRowDeleting="grid_RowDeleting" OnRowInserting="grid_RowInserting" OnRowUpdating="grid_RowUpdating"> <Columns> <dx:GridViewCommandColumn ShowEditButton="true" ShowDeleteButton="true" ShowNewButtonInHeader="true" /> <dx:GridViewDataTextColumn FieldName="ProductID" EditFormSettings-Visible="False" /> <dx:GridViewDataTextColumn FieldName="ProductName" /> <dx:GridViewDataTextColumn FieldName="UnitPrice" /> </Columns> </dx:ASPxGridView> </div> <br /> <a href="Default.aspx"><< Home</a> </form> </body> </html>
GridEntityFramework/CustomEditingCapabilities.aspx.cs(vb)
C#
using System; using System.Linq; using System.Collections; using DevExpress.Web; namespace GridEntityFramework { public partial class CustomEditingCapabilities : System.Web.UI.Page { private Model1 _dataContext; public Model1 DataContext { get { if (_dataContext == null) { _dataContext = new Model1(); } return _dataContext; } } protected void Page_Load(object sender, EventArgs e) { if (!IsCallback && !IsPostBack) { grid.DataBind(); } } protected void grid_RowDeleting(object sender, DevExpress.Web.Data.ASPxDataDeletingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); DataContext.Products.Remove(product); DataContext.SaveChanges(); e.Cancel = true; } protected void grid_RowInserting(object sender, DevExpress.Web.Data.ASPxDataInsertingEventArgs e) { var product = new Product(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; DataContext.Products.Add(product); DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); } protected void grid_RowUpdating(object sender, DevExpress.Web.Data.ASPxDataUpdatingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); } protected void grid_DataBinding(object sender, EventArgs e) { grid.ForceDataRowType(typeof(Product)); grid.DataSource = DataContext.Products.ToList(); } } }
GridEntityFramework/MasterDetail.aspx
ASPx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MasterDetail.aspx.cs" Inherits="GridEntityFramework.MasterDetail" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Master Detail Grid</title> </head> <body> <form id="form1" runat="server"> <dx:ASPxGridView ID="gridMaster" runat="server" AutoGenerateColumns="False" OnDataBinding="gridMaster_DataBinding" KeyFieldName="CategoryID"> <Columns> <dx:GridViewDataTextColumn FieldName="CategoryID" > <EditFormSettings Visible="False" /> </dx:GridViewDataTextColumn> <dx:GridViewDataTextColumn FieldName="CategoryName" /> <dx:GridViewDataTextColumn FieldName="Description" /> </Columns> <Templates> <DetailRow> <dx:ASPxGridView ID="gridDetail" runat="server" AutoGenerateColumns="False" OnInit="gridDetail_Init" KeyFieldName="ProductID"> <Columns> <dx:GridViewDataTextColumn FieldName="ProductID" > <EditFormSettings Visible="False" /> </dx:GridViewDataTextColumn> <dx:GridViewDataTextColumn FieldName="ProductName" /> <dx:GridViewDataTextColumn FieldName="UnitPrice" /> <dx:GridViewDataCheckColumn FieldName="Discontinued" /> </Columns> </dx:ASPxGridView> </DetailRow> </Templates> <SettingsDetail ShowDetailRow="true" /> </dx:ASPxGridView> </div> <br /> <a href="Default.aspx"><< Home</a> </form> </body> </html>
GridEntityFramework/MasterDetail.aspx.cs(vb)
C#
using DevExpress.Web; using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace GridEntityFramework { public partial class MasterDetail : System.Web.UI.Page { private Model1 _dataContext; public Model1 DataContext { get { if (_dataContext == null) { _dataContext = new Model1(); } return _dataContext; } } protected void Page_Load(object sender, EventArgs e) { if (!IsCallback && !IsPostBack) { gridMaster.DataBind(); } } protected void gridMaster_DataBinding(object sender, EventArgs e) { gridMaster.ForceDataRowType(typeof(Category)); gridMaster.DataSource = DataContext.Categories.ToList(); } protected void gridDetail_Init(object sender, EventArgs e) { ASPxGridView grid = sender as ASPxGridView; int masterKey = (int)grid.GetMasterRowKeyValue(); grid.DataSource = DataContext.Products.Where(p => p.CategoryID == masterKey).ToList(); grid.DataBind(); } } }
GridEntityFramework/LookUpColumn.aspx
ASPx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LookUpColumn.aspx.cs" Inherits="GridEntityFramework.LookUpColumn" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Lookup Column</title> </head> <body> <form id="form1" runat="server"> <div> <dx:ASPxGridView ID="grid" runat="server" AutoGenerateColumns="False" OnDataBinding="grid_DataBinding" OnRowDeleting="grid_RowDeleting" OnRowInserting="grid_RowInserting" OnRowUpdating="grid_RowUpdating" KeyFieldName="ProductID"> <Columns> <dx:GridViewCommandColumn ShowEditButton="True" /> <dx:GridViewDataTextColumn FieldName="ProductID" > <EditFormSettings Visible="False" /> </dx:GridViewDataTextColumn> <dx:GridViewDataTextColumn FieldName="ProductName" /> <dx:GridViewDataTextColumn FieldName="UnitPrice" / <dx:GridViewDataComboBoxColumn Caption="Category" FieldName="CategoryID" > <PropertiesComboBox TextField="CategoryName" ValueField="CategoryID" ValueType="System.Int32" /> </dx:GridViewDataComboBoxColumn> </Columns> </dx:ASPxGridView> </div> <br /> <a href="Default.aspx"><< Home</a> </form> </body> </html>
GridEntityFramework/LookUpColumn.aspx.cs(vb)
C#
using DevExpress.Web; using System; using System.Collections.Generic; using System.Linq; namespace GridEntityFramework { public partial class LookUpColumn : System.Web.UI.Page { private Model1 _dataContext; public Model1 DataContext { get { if (_dataContext == null) { _dataContext = new Model1(); } return _dataContext; } } protected void Page_Init(object sender, EventArgs e) { ((GridViewDataComboBoxColumn)grid.DataColumns["CategoryID"]).PropertiesComboBox.DataSource = DataContext.Categories.ToList(); } protected void Page_Load(object sender, EventArgs e) { if (!IsCallback && !IsPostBack) { grid.DataBind(); } } protected void grid_RowDeleting(object sender, DevExpress.Web.Data.ASPxDataDeletingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); DataContext.Products.Remove(product); DataContext.SaveChanges(); e.Cancel = true; } protected void grid_RowInserting(object sender, DevExpress.Web.Data.ASPxDataInsertingEventArgs e) { var product = new Product(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; product.CategoryID = (int)e.NewValues["CategoryID"]; DataContext.Products.Add(product); DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); } protected void grid_RowUpdating(object sender, DevExpress.Web.Data.ASPxDataUpdatingEventArgs e) { int productID = (int)e.Keys[grid.KeyFieldName]; Product product = DataContext.Products.Where(p => p.ProductID == productID).FirstOrDefault(); product.ProductName = (string)e.NewValues["ProductName"]; product.UnitPrice = (decimal)e.NewValues["UnitPrice"]; product.CategoryID = (int)e.NewValues["CategoryID"]; DataContext.SaveChanges(); e.Cancel = true; grid.CancelEdit(); } protected void grid_DataBinding(object sender, EventArgs e) { grid.ForceDataRowType(typeof(Product)); grid.DataSource = DataContext.Products.ToList(); } } }
GridEntityFramework/ServerModeEF.aspx
ASPx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ServerModeEF.aspx.cs" Inherits="GridEntityFramework.ServerModeEF" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Entity Framework Server Mode</title> </head> <body> <form id="form1" runat="server"> <div> <dx:ASPxGridView ID="grid" runat="server" AutoGenerateColumns="False" KeyFieldName="ProductID" OnDataBinding="grid_DataBinding"> <Columns> <dx:GridViewDataTextColumn FieldName="ProductID" /> <dx:GridViewDataTextColumn FieldName="ProductName" /> <dx:GridViewDataTextColumn FieldName="UnitPrice" /> <dx:GridViewDataCheckColumn FieldName="Discontinued" /> </Columns> </dx:ASPxGridView> </div> <br /> <a href="Default.aspx"><< Home</a> </form> </body> </html>
GridEntityFramework/ServerModeEF.aspx.cs(vb)
C#
using DevExpress.Data.Linq; using DevExpress.Web; using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace GridEntityFramework { public partial class ServerModeEF : System.Web.UI.Page { private Model1 _dataContext; public Model1 DataContext { get { if (_dataContext == null) { _dataContext = new Model1(); } return _dataContext; } } protected void Page_Load(object sender, EventArgs e) { if (!IsCallback && !IsPostBack) grid.DataBind(); } protected void grid_DataBinding(object sender, EventArgs e) { (sender as ASPxGridView).DataSource = GetEntityServerModeSource(); } private EntityServerModeSource GetEntityServerModeSource() { EntityServerModeSource esms = new EntityServerModeSource(); esms.QueryableSource = DataContext.Products; esms.KeyExpression = "ProductID"; return esms; } } }

Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.