Skip to main content

GridControl.EditFormContent Property

Gets or sets the template used to define the visual presentation of the grid’s row edit form.

Namespace: DevExpress.Mobile.DataGrid

Assembly: DevExpress.Mobile.Grid.v18.2.dll

Declaration

public DataTemplate EditFormContent { get; set; }

Property Value

Type Description
Xamarin.Forms.DataTemplate

A Xamarin.Forms.DataTemplate object.

Remarks

Important

This documentation topic describes legacy technology. We no longer develop new functionality for the GridControl and suggest that you use the new DataGridView control instead.

Use the EditFormContent property to replace a GridControl‘s default row edit form with your custom form.

Example

GridControl allows you to substitute the default row edit form with a custom form. This example explains how to do this.

In this application, the grid is bound to a collection of orders. Each data row in the grid represents an individual order and displays the following information:

  • Ordered product name (the Product column)
  • Product unit price (the Price column)
  • Number of ordered product units (the Quantity column)
  • Order total value (the Total column)
  • A value indicating whether an order is shipped (the Shipped column)

The default row edit form in this grid looks like the following.

iOS Android
GridControl_iOS_DefaulRowEditForm GridControl_Android_DefaulRowEditForm

This example demonstrates how to create a custom form to add new data rows and another form to edit existing rows.

  • Add New Order Form

    This form is invoked on tapping New Item Row in the grid and allows an end user to add a new data row (create a new order). On this form, an end user can select a product name via a Picker control, and set the number of ordered product units via a Slider control. A unit price is automatically shown for the selected product, and the order total value is automatically calculated.

    iOS Android
    GridControl_iOS_CustomNewRowForm GridControl_Android_CustomNewRowForm
  • Edit Order Form

    This form is invoked on double-tapping a cell or selecting Edit Cell from the popup menu. It allows an end user to modify existing data rows. On this form, product name and unit price are shown in Lable controls and cannot be changed. An end user can change the number of ordered product units via a Slider control and use the Switch control to set whether the order is shipped.

    iOS Android
    GridControl_iOS_CustomRowEditForm GridControl_Android_CustomRowEditForm

To create a custom row edit form and show it instead of the default form, execute the steps below.

  1. Specify a custom form view. In this example, it is a ContentView descendant with a set of labels and editors inside (see the CustomFormEditorContent.cs file). This view’s BindingContext is an EditValuesContainer object. Labels and editors are bound to data fields via the EditValuesContainer.GetBindingPath method with data field names passed as parameters.

    The EditValuesContainer.IsNewRow property identifies whether a from is invoked for a new or existing row.

    Custom form captions are implemented by using the mechanism of localization.

  2. Create a DataTemplate instance for your custom form view and assign this template to the GridControl.EditFormContent property (see the MainPage.xaml.cs file).
  3. Set the GridControl.RowEditMode property to RowEditMode.Popup to show a form instead of an in-place row editor.
See Also