Published articles on other web sites*

Published articles on other web sites*

WPF 4 DataGrid: Delete Multiple Rows

The WPF DataGrid has really got me interested to develop line-of-Business application, and I continue using it in different implementations. Read more at WPF: Two way TextBox Binding and WPF 4: Using ObjectDataProvider for DataBinding.

One important observation is that when we use this WPF DataGrid for application development and data representation, there are many occasions where you have to use it for Data manipulations too. In this article, I will demonstrate how to delete multiple rows from the WPF DataGrid.

WPF DataGrid allows us to use inbuilt column types and also allows us to define template columns using various WPF elements e.g. the ComboBox, Image etc. One of the default column template type provided to us, is the CheckBox column. In this article, I have used the same for multiple rows delete from a DataGrid.

Step 1: Create a WPF application and define the following
classes in it:

Employee Collection

The above classes represent Employee entity and Data Collection.

Step 2: In the MainWindow.xaml, define the following XAML code:

<Window x:Class='WPF40_DataGrid_Row_Drag_Drop.MainWindow'
Title='MainWindow' Height='428' Width="532">
<data:EmployeeCollection x:Key="EmpDs"></data:EmployeeCollection>
<Grid DataContext='{Binding Source={StaticResource EmpDs}}">
<DataGrid AutoGenerateColumns='False' Height='242'
HorizontalAlignment='Left' Margin='33,91,0,0'
Name='dgEmployee' VerticalAlignment='Top'
Width='442' ItemsSource='{Binding}'
SelectionMode='Extended'    AllowDrop="True" >
<DataGridTextColumn Binding='{Binding EmpNo}'
Header="EmpNo" />
<DataGridTextColumn Binding='{Binding EmpName}'
Header="EmpName" />
<DataGridTextColumn Binding='{Binding Salary}'
Header="Salary" />
<TextBox Height='43' HorizontalAlignment='Left'
Margin='33,28,0,0' Width='442'
Name='textBox1' VerticalAlignment='Top'
Text='Employee Information'
FontFamily='SimSun' FontSize="28" />

The above XAML code defines a DataGrid with various columns bound to the ‘Employee’ class properties. Notice that the DataGrid also defines the ‘DataGridCheckBoxColumn’. We will be using the same checkbox for deleting rows from the DataGrid. To complete the Delete operation, the XAML code also defines a Button element called btnDelete. The DataGrid subscribes to the ‘RowEditing’ event. This event will be raised when the CheckBox is checked in the CheckBoxColumn and control is shifted to the next row.

Step 3: Open MainWindow.xaml.cs and write the following code:

Define following at class level:

List<int> lstSelectedEmpNo;
EmployeeCollection EmpCollection = new EmployeeCollection();

In the loaded event, write the following code:

private void Window_Loaded(object sender, RoutedEventArgs e)
dgEmp.ItemsSource = EmpCollection;
lstSelectedEmpNo = new List<int>();

The code shown above binds the Employee collection to the DataGrid.

Write the following code in the RowEditing event:

private void dgEmp_RowEditEnding(object sender,
DataGridRowEditEndingEventArgs e)
FrameworkElement element = dgEmp.Columns[4].GetCellContent(e.Row);
if (element.GetType() == typeof(CheckBox))
if (((CheckBox)element).IsChecked == true)
FrameworkElement cellEmpNo =
int EmpNo = Convert.ToInt32(((TextBlock)cellEmpNo).Text);

The above code reads the content of the fourth column of the DataGrid (the CheckBoxColumn). If the checkbox is checked, then for the selected row of the checked check box, the EmpNo is read and it is added to the ‘lstSelectedEmpNo’ List<T>.

Write the following code in the button ‘Delete Rows’ Click event:

private void btnDeleteRows_Click(object sender, RoutedEventArgs e)
int count=0;
foreach (int eno in lstSelectedEmpNo)
Employee emp = (from ep in EmpCollection
where ep.EmpNo == eno
select ep).First();
MessageBox.Show(count + 'Row's Deleted' );
catch (Exception ex)

The above code deletes the selected EmpNo from the collection.

Step 4: Run the application and the result will as shown below:

WPF DataGrid Delete

Select check-boxes of the rows you want to delete

WPF DataGrid Delete Multiple

Now click on the ‘Delete Rows’ button, the following result will be displayed:

WPF DataGrid Delete Multiple

1 comment:

  1. Best Implementation Of WPF Extended DataGrid Can be found here
    WPF Extended DataGrid
    Column Choosers.
    AutoFilter Control.
    Export To Excel Feature.
    Copy Paste To Excel and Copy Paste From Excel To DataGrid.
    Three State Sorting.
    Displaying Sort Order If Multiple Sort is done.
    Export To Excel with formatting.
    Export To PDF with formatting.


Related Posts Plugin for WordPress, Blogger...