Click here to Skip to main content
Click here to Skip to main content

An extended GridView that allows inserting rows

, 7 Mar 2006
Rate this:
Please Sign up or sign in to vote.
Yet another insertable ASP.NET GridView control.

Insertable gridview

Introduction

This article describes (yet another) insertable GridView. You probably know that the GridView control is the preferred control in ASP.NET v.2 to display and edit tabular data. Although GridView is improved over the previous DataGrid control, it still lacks the capability of inserting new rows. Microsoft says that you can use the FormView or DetailsView components to insert a new row. However, often it is convenient to add a new row in-place. The modified web server GridView control I present makes this possible by adding a 'plus' image in the footer row. When pressed, a new row is added to the database with default values, and the grid shows the new row in editing mode, at the bottom of the last grid page (see image below). If you press the Cancel button, the new row is deleted from the database. The sorting of the GridView is restored after editing the new row.

Insertable gridview when a new row is added

Besides the insert functionality, the code automatically adds button images in the first column of the grid for Select, Edit, and Delete operations.

Using the code

The modified control is implemented as a custom server control that inherits the GridView control. To use it, add a reference to the PSControls.dll file or the PSControls project. If you use the project, you can further customize the control, and also localize the control messages by creating a Messages.XX.resx where XX is your language.

Then, drop a PSGridView control on your .aspx form and configure it using the smart tag menu. The first field (column) must be an empty TemplateField because the code creates the Add, Select, Edit, Delete, Update, and Cancel buttons there. An example of configuring the fields using Visual Studio 2005 is shown below:

Insertable gridview columns

You can determine whether the Add, Select, Edit, and Delete buttons are created, by setting the boolean CanAdd, CanSelect, CanEdit, and CanDelete custom properties of the control, respectively. Additionally, you can disable all editing buttons by setting the IsEditable property to False. By default, all these properties are set to True.

The control adds a new row to the database when the Add button is pressed. So, if the table where you are inserting has 'not null' column(s), an exception will be thrown, unless you put default values for these columns in the Inserting event of the data source control. An example is shown below:

Protected Sub sqlCustomers_Inserting(ByVal sender As Object, _
      ByVal e As System.Web.UI.WebControls.SqlDataSourceCommandEventArgs) _
      Handles sqlCustomers.Inserting
    e.Command.Parameters("@CustomerType").Value = "S"
End Sub

To have the images appear as in the examples, copy the images folder of the demo at the root of your Web application. Alternatively, specify your own images by means of the AddImageUrl, EditImageUrl, DelImageUrl, SelImageUrl, UpdateImageUrl, and CancelImageUrl properties.

Update: I realized after the initial publication that the insert functionality works correctly only if the primary key of the new row is always incremented. This can be easily implemented by defining an identity (auto-increment) primary key column, e.g., ID int NOT NULL IDENTITY(1,1) PRIMARY KEY, .... Additionally, you must create an empty template for the plus icon to appear when the table has no rows. You can do it with Visual Studio, or by inserting a <EmptyDataTemplate></EmptyDataTemplate> tag into the controls declaration.

History

  • Version 1.0 - Basic insertable row functionality. Editing controls.
  • Version 1.01 - Updates so that changes of the CanXXX properties on the PreRender event handler takes effect on the control.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

About the Author

Philipos Sakellaropoulos
Web Developer
Greece Greece
Software developer and Microsoft Trainer, Athens, Greece (MCT, MCSD.net, MCSE 2003, MCDBA 2000,MCTS, MCITP, MCIPD).
Follow on   Twitter   Google+

Comments and Discussions

 
QuestionCan a new row contain a dropdownlist? PinmemberMember 422925226-Jun-08 8:44 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140721.1 | Last Updated 8 Mar 2006
Article Copyright 2006 by Philipos Sakellaropoulos
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid