DevExpress WPF Grid Control - Editing Data

WPF Team Blog
17 February 2009

Prompted by a forum post, I decided to have a look at how inplace editing works in the DXGrid for WPF. Good results – it's really easy.

The first interesting thing to realize is that editing is actually active by default in the grid. Nevertheless, the end user can't edit anything unless one setting is changed: the property NavigationStyle on the View must be changed to CellNavigation (by default it's RowNavigation). As soon as this setting is changed, editing becomes possible, since both the AllowEditing on the GridControl itself and the GridColumnView instance are True by default.

Here's my minimum XAML snippet that results in an editable grid. I'm using the same country datasource that I was using in my first DXGrid blog post.

<Window x:Class="DxGridEditing.Window1"

   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

   xmlns:local="clr-namespace:DxGridEditing"

   Title="Window1" Height="342" Width="534" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid" xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors">

    <Window.Resources>

        <local:CountryInfoList x:Key="list" />

    </Window.Resources>

    <DockPanel>

        <dxg:GridControl Name="gridControl1" AutoPopulateColumns="True" DataSource="{StaticResource list}">

            <dxg:GridControl.View>

                <dxg:GridColumnView NavigationStyle="CellNavigation" />

            </dxg:GridControl.View>

        </dxg:GridControl>

    </DockPanel>

</Window>

The default being what it is, the question is obviously how to go about changing that. The first thing I want to do is switch off editing for one or more columns. In my code, I've been using automatic column creation so far, and I have to switch over to pre-configured columns in order to do this. Easy enough to do – get rid of the AutoPopulateColumns attribute on the GridControl and add a few GridColumn instances instead (bring up the GUI editor for the GridControl.Columns property if you don't like to do the typing).

<dxg:GridControl Name="gridControl1" DataSource="{StaticResource list}">

    <dxg:GridControl.Columns>

        <dxg:GridColumn FieldName="Name" />

        <dxg:GridColumn FieldName="AreaKM2" />

        <dxg:GridColumn FieldName="Population" />

    </dxg:GridControl.Columns>

    <dxg:GridControl.View>

        <dxg:GridColumnView NavigationStyle="CellNavigation" />

    </dxg:GridControl.View>

</dxg:GridControl>

From this point, it's easy to configure per-column settings, and that includes whether or not a certain column can actually be edited. The AllowEditing settings on the GridControl and the GridColumnView act as defaults, but each column has the final word when a decision about editing must be made.

There are two settings that come in handy. First, the column also has an AllowEditing property, and it's default value is Default, meaning it takes its value from its parent. Setting this to False (assuming the parent default is True) disables editing for this column entirely. As an alternative, there's also a ReadOnly property, which I personally find very useful – in a situation where some grid columns are editable, it's often sensitive to allow the user access to the values in the other, non-editable columns, for copying to the clipboard. Leaving AllowEditing on its Default value, but setting ReadOnly to True has the result that the editor for a column is still available, but the value can't be changed.

<dxg:GridControl.Columns>

    <dxg:GridColumn FieldName="Name" />

    <!-- Using both ReadOnly and AllowEditing at the same time

         doesn't really make too much sense, unless the idea is

         to override the parent default for AllowEditing. In

         this case I just left both in place for illustration

         purposes.

    -->

    <dxg:GridColumn FieldName="AreaKM2" ReadOnly="True" AllowEditing="False" />

    <dxg:GridColumn FieldName="Population" />

</dxg:GridControl.Columns>

The final thing I want to mention here is the configuration of the EditSettings property. The settings that are provided out of the box (TextEditSettings, CheckEditSettings, ComboBoxEditSettings and DateEditSettings) encapsulate the editor types that our grid supports at the time of writing. So it's important to be aware of this setting, because it defines which editor will be used.

I was going to continue for a bit by mentioning a few of the customizations that can be made to the editing settings, but I stumbled upon a few issues that need research. I'll continue with more details a bit later.

Here is the download of the sample project: DxGridEditing.zip

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.