sony
sony

Reputation: 1503

How to make one column editable in a readonly datagrid?

How to make one column editable in a readonly datagrid?

<DataGrid x:Name="dgLoadDtl" Height="315" Width="710" Grid.Row="0" 
                  HorizontalAlignment="Left" VerticalAlignment="Bottom"  
                  Style="{DynamicResource StyleDatagrid}" 
                  IsReadOnly="true">

            <DataGrid.Columns>                    

                <DataGridTextColumn Foreground="Black" Width="60" Header="Sctn" Binding="{Binding Sctn, Mode=TwoWay}" IsReadOnly="false" />                    
                <DataGridTextColumn Foreground="Black" Width="140" Header="CustName"  Binding="{Binding CustName, Mode=TwoWay}" />
                <DataGridTextColumn Foreground="Black" Width="140" Header="Address"  Binding="{Binding Address1, Mode=TwoWay}" />
                <DataGridTextColumn Foreground="Black" Width="50" Header="Bulk   or Bag"  Binding="{Binding BulkorBag, Mode=TwoWay}" />
                <DataGridTextColumn Foreground="Black" Width="80" Header="ProdCode" Binding="{Binding ProdCode, Mode=TwoWay}" />
                <DataGridTextColumn Foreground="Black" Width="80" Header="MedCode" Binding="{Binding MedCode, Mode=TwoWay}" />

Upvotes: 15

Views: 27991

Answers (2)

AntonK
AntonK

Reputation: 1310

When DataGrid is bound to a read-only view (a kind of view generated with IEnumerable), you can't set its property IsReadOnly to "false", because WPF doesn't like that. And you'll have to go other route, like converting the editable column to DataGridTemplateColumn.
For instance, if you had a checkbox-styled column like this

<DataGridCheckBoxColumn Binding="{Binding IsSelected}"/>

to make it editable/changeable you can replace it with something like this

<DataGridTemplateColumn>
   <DataGridTemplateColumn.CellTemplate>
       <DataTemplate>
           <CheckBox IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}"/>
       </DataTemplate>
   </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

As a bonus for such column you'll get a one-click change behaviour (ref)

Upvotes: 0

Jon Heaton
Jon Heaton

Reputation: 302

I created a sample where I bound the ItemsSource of the DataGrid to an ObservableCollection and from here you have two options.

  1. Set AutoGenerateColumns="False" on the DataGrid and set IsReadOnly="True" for all columns except the column you want to be editable you will set IsReadOnly="False".
  2. AutoGenerateColumns="True" (it is the default, so you could just remove the attribute from the XAML) and make the setters private in your ViewModel for all of the properties except the column you want to be editable.

Here is my sample code for option 1:

<DataGrid x:Name="dgLoadDtl" Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="Top" ItemsSource="{Binding MyData}" AutoGenerateColumns="False">
    <DataGrid.Columns>
        <DataGridTextColumn Foreground="Black" Width="60" Header="Sctn" Binding="{Binding Sctn, Mode=TwoWay}" IsReadOnly="false" />
        <DataGridTextColumn Foreground="Black" Width="140" Header="CustName"  Binding="{Binding CustName, Mode=TwoWay}" IsReadOnly="True"/>
        <DataGridTextColumn Foreground="Black" Width="140" Header="Address"  Binding="{Binding Address1, Mode=TwoWay}" IsReadOnly="True"/>
        <DataGridTextColumn Foreground="Black" Width="50" Header="Bulk   or Bag"  Binding="{Binding BulkorBag, Mode=TwoWay}" IsReadOnly="True"/>
        <DataGridTextColumn Foreground="Black" Width="80" Header="ProdCode" Binding="{Binding ProdCode, Mode=TwoWay}" IsReadOnly="True"/>
        <DataGridTextColumn Foreground="Black" Width="80" Header="MedCode" Binding="{Binding MedCode, Mode=TwoWay}" IsReadOnly="True"/>
    </DataGrid.Columns>
</DataGrid>

Upvotes: 23

Related Questions