I have a DataGrid. I have an “Edit” button in every row of my DataGrid. When the user clicks on this edit button, each cell of this row goes into edit mode. When I click on any edit button, the template changes to a save button. When I'm done, I click on this save button, and the DataGridRow exits the edit mode, and the "Save" button changes again to the "Edit" button. It works great.
Here is my code:
Xaml:
<DataGrid Grid.Column="1" Grid.Row="3" AutoGenerateColumns="False" RowHeaderWidth="0" GridLinesVisibility="Vertical"
ItemsSource="{Binding Source={StaticResource ItemsViewSource}}" SelectedItem="{Binding SelectedItem}"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="False"
SelectionMode="Single" SelectionUnit="FullRow">
<DataGrid.Columns>
<DataGridTemplateColumn Header="Name of the Item" Width="*" SortDirection="Ascending">
<DataGridTemplateColumn.HeaderStyle>
<Style TargetType="DataGridColumnHeader" BasedOn="{StaticResource {x:Type DataGridColumnHeader}}">
<Setter Property="HorizontalContentAlignment" Value="Left"/>
</Style>
</DataGridTemplateColumn.HeaderStyle>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<TextBox Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}" PreviewKeyDown="TextBox_PreviewKeyDown"/>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
<DataGridTemplateColumn.CellStyle>
<Style TargetType="{x:Type DataGridCell}" BasedOn="{StaticResource {x:Type DataGridCell}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridCell}">
<Grid Background="{TemplateBinding Background}">
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Left" Margin="5,0,0,0" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</DataGridTemplateColumn.CellStyle>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Edit" Width="50" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button Content="Edit" Style="{StaticResource EditSaveButton}"
Command="{Binding DataContext.EditItemCommand,
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Page}}}"
Click="EditButton_Click"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Delete" Width="70" IsReadOnly="True">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button Content="Delete" Style="{StaticResource DeleteButton}"
Command="{Binding DataContext.CancelItemEditOrDeleteCommand,
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Page}}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
Background Code (CS):
void EditButton_Click(object sender, RoutedEventArgs e)
{
int colIndex = 0;
int rowIndex = 0;
DependencyObject dep = (DependencyObject)e.OriginalSource;
while (dep != null && !(dep is DataGridCell))
{
dep = VisualTreeHelper.GetParent(dep);
}
if (dep == null)
return;
DataGridRow row = null;
if (dep is DataGridCell)
{
colIndex = ((DataGridCell)dep).Column.DisplayIndex;
while (dep != null && !(dep is DataGridRow))
{
dep = VisualTreeHelper.GetParent(dep);
}
row = (DataGridRow)dep;
rowIndex = FindRowIndex(row);
}
while (dep != null && !(dep is DataGrid))
{
dep = VisualTreeHelper.GetParent(dep);
}
if (dep == null)
return;
DataGrid dg = (DataGrid)dep;
if (row != null)
{
var rows = GetDataGridRows(dg);
if (row.IsEditing)
{
dg.CommitEdit(DataGridEditingUnit.Row, true);
foreach (DataGridRow r in rows)
{
r.IsEnabled = true;
}
}
else
{
dg.CurrentCell = new DataGridCellInfo(dg.Items[rowIndex], dg.Columns[0]);
dg.BeginEdit();
foreach (DataGridRow r in rows)
{
if (!(r.IsEditing))
{
r.IsEnabled = false;
}
}
}
}
}
public DataGridCell GetDataGridCell(DataGridCellInfo cellInfo)
{
var cellContent = cellInfo.Column.GetCellContent(cellInfo.Item);
if (cellContent != null)
return (DataGridCell)cellContent.Parent;
return null;
}
private int FindRowIndex(DataGridRow row)
{
DataGrid dataGrid = ItemsControl.ItemsControlFromItemContainer(row) as DataGrid;
int index = dataGrid.ItemContainerGenerator.IndexFromContainer(row);
return index;
}
public IEnumerable<DataGridRow> GetDataGridRows(DataGrid grid)
{
var itemsSource = grid.ItemsSource as IEnumerable;
if (null == itemsSource) yield return null;
foreach (var item in itemsSource)
{
var row = grid.ItemContainerGenerator.ContainerFromItem(item) as DataGridRow;
if (null != row) yield return row;
}
}
Basically I have 2 questions:
- When I doubleclick a cell, that cell goes into edit mode. I want to stop this behavior as I provide an edit button.
- - , 1- , , , cellTemplate. . , , cellEditTemplate , "" .
- , .
.