Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Collapse]WinForms Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Expand]Getting Started
   [Expand]Binding to Data
   [Expand]Grid View
   [Expand]View Technology
   [Expand]Grouping
   [Expand]Sorting
   [Expand]Summaries
   [Collapse]Data Editing
    [Expand]Edit Form
    [Expand]Editing via Code
    [Expand]In-place Editors
    [Expand]Input Validation
    [Expand]New Item Row
     Tutorial: Add or Remove Rows
     Tutorial: Data Input Validation
   [Expand]Filtering and Locating Rows
   [Expand]Focus and Selection Handling
   [Expand]Processing Rows
   [Expand]Formatting Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
   [Expand]Batch Modifications
   [Expand]Hit Information
   [Expand]Hints
   [Expand]Popup Menus
   [Expand]Saving and Restoring Layouts
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]Examples
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Chart Control
  [Expand]Diagrams
  [Expand]Gauges
  [Expand]Map Control
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]Printing-Exporting
  [Expand]PDF Viewer
   Reporting
  [Expand]Snap
  [Expand]TreeMap Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Tutorial: Add or Remove Rows

This walkthrough is a transcript of the Add or Remove Rows video available on the DevExpress YouTube Channel.

This tutorial describes the grid control's UI elements and API that enable you and end-users to add or remove data rows. You will first learn how to enable the built-in Data Navigator, then how to use the Microsoft Outlook inspired New Item row to add new records. Finally, the walkthrough will show you the basic API that enables you to add or delete rows, and also initialize field values when end-users add records using the grid control's UI.

Expanded Activating and Using Data Navigator

First, you can enable end-users to add and delete rows using an embedded navigator control. To do this, set the GridControl.UseEmbeddedNavigator property to true.

The navigator appears at the left-bottom corner. Run the application to see what can be done using the navigator. Click the Append button to add a row.

After you've done initializing cell values, you can post changes using the End Edit button.

Note that there's also the Cancel Changes button available. To delete rows, simply click the Delete button.

Expanded Enabling and Using New Item Row

Another way to add new rows is by using the New Item row. To enable it, expand GridView.OptionsView and set the GridOptionsView.NewItemRowPosition property to NewItemRowPosition.Top.

The New Item row is now displayed at the top of the grid. Run the application. Click the row, initialize cell values and post the changes, which can be done by moving row focus or by pressing ENTER when the last row cell is focused.

You can use the ESCAPE key to cancel adding a new row. If you're editing a cell, the first key press will discard changes to that cell. Press ESCAPE again to remove the entire row.

Using the same property, you can position the New Item row after all other records. In a similar fashion, you can start editing this row and then post the changes to create a new record.

Expanded Adding and Removing Rows in Code

To facilitate end-user input, you may want to predefine cell values in newly added rows. For this purpose, handle the ColumnView.InitNewRow event, which fires whenever a row is being added using the grid control's UI. Use the event's InitNewRowEventArgs.RowHandle parameter to identify the row being added and write the current date and time into a cell.

You may also need to provide custom UI for adding or deleting rows, like the Add Row ribbon button in this example. In the Click event handler, call the View’s GridView.AddNewRow method. Similarly, you can add the Delete Row button, whose Click handler should call the ColumnView.DeleteRow method to delete the currently focused row.

Run the application and click the Add Row button. You can see that the Date field value is automatically initialized with the current date. Now focus the newly added row and click the Delete button to remove it.

Expanded See Also

How would you rate this topic?​​​​​​​