how to make the column editable in ListView?

Question

I use WPF (C #).

I want the user to be able to edit the column «Description»:

<ListView>
  <ListView.View>
    <GridView>

        <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Path=Name}"></GridViewColumn>
        <GridViewColumn Header="Number" DisplayMemberBinding="{Binding Path=Number}"></GridViewColumn>
        <GridViewColumn Header="Description" >
            <GridViewColumn.CellTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Path=Description}" TextWrapping="Wrap" Margin="0"></TextBlock>
                </DataTemplate>
            </GridViewColumn.CellTemplate>
        </GridViewColumn>

    </GridView>
  </ListView.View>
</ListView>

Please tell me, how to make the column «Description» editable?

May be better to use another control for this purpose? What?

Answer 1

Create a customized control called EditBox for GridViewColumn.CellTemplate.

In Normal mode, a TextBlock is used to display content; In Editing mode, a TextBox will pop up for editing.

Class inhertied from Control

Editing In ListView

public class EditBox : Control
{
            static EditBox()
            {              
            public static readonly DependencyProperty ValueProperty =
                    DependencyProperty.Register(
                            "Value",
                            typeof(object),
                            typeof(EditBox),
                            new FrameworkPropertyMetadata());
}

Add a dependency Property for IsEditing.

 public static DependencyProperty IsEditingProperty =
                    DependencyProperty.Register(
                            "IsEditing",
                            typeof(bool),
                            typeof(EditBox),
                            new FrameworkPropertyMetadata(false)
                            );

Style for the Custom EditBox:

 <Style x:Key="{x:Type l:EditBox}" TargetType="{x:Type l:EditBox}" >
      <Setter Property="HorizontalAlignment" Value="Left"  />
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="{x:Type l:EditBox}">
                <TextBlock x:Name="PART_TextBlockPart" 
                     Text="{Binding Path=Value, RelativeSource = {RelativeSource TemplatedParent}}">
                </TextBlock>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

In your Xaml, you can place the EditBox:

   <GridViewColumn Header="Description" >
        <GridViewColumn.CellTemplate>
            <DataTemplate>
               <i:EditBox>
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>

Answer 2

You can change that TextBlock to TextBox as below:

<ListView>
<ListView.View>
<GridView>

    <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Path=Name}"></GridViewColumn>
    <GridViewColumn Header="Number" DisplayMemberBinding="{Binding Path=Number}"></GridViewColumn>
    <GridViewColumn Header="Description" >
        <GridViewColumn.CellTemplate>
            <DataTemplate>
                <TextBox Text="{Binding Path=Description}" TextWrapping="Wrap" Margin="0"></TextBox>
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>

</GridView>
</ListView.View>
</ListView>