Click here to Skip to main content
15,867,308 members
Articles / Web Development / ASP.NET
Article

Extending the GridView CommandField To Add Delete Confirmation

Rate me:
Please Sign up or sign in to vote.
4.42/5 (11 votes)
5 Sep 2007CPOL2 min read 126.2K   1.4K   58   20
Tired of constantly writing the same labourious plumbing to add a confirmation to a delete button in a GridView? I was, so I simplified things.
Screenshot - ExtendedCommandField.gif

Introduction

We've all added delete confirmations before; they're a really great way of stopping users from doing something they didn't intend with disastrous consequences. Sadly the GridView's CommandField doesn't natively support this, requiring lots of boring plumbing to be duplicated in code-behind files. This article describes a simple, clean and reusable method of adding a delete confirmation by extending the CommandField control.

Background

This article roughly follows on from my previous article on extending the GridView control and illustrates in a similar manner, the advantage of extending existing controls to provide additional functionality.

About the Code

The sample project contains a demo form and the key class ExtendedCommandField. It simply inherits from the standard CommandField class and provides a new property, DeleteConfirmationText, that allows you to set the text that will appear in the confirmation box. If no text is supplied, the field behaves like a standard CommandField and provides no delete confirmation. When the property is set, the usual basic JavaScript to display the confirmation box is added to the delete button.

This is all done in the InitializeCell method where you can perform all sorts of tricks to further customize the appearance and behaviour of the field.

C#
/// <summary>
/// An extended <see cref="CommandField"/> that allows deletions
/// to be confirmed by the user.
/// </summary>
public class ExtendedCommandField : CommandField
{
    /// <summary>
    /// Initialize the cell.
    /// </summary>
    public override void InitializeCell(DataControlFieldCell cell, 
        DataControlCellType cellType, DataControlRowState rowState, int rowIndex)
    {
        base.InitializeCell(cell, cellType, rowState, rowIndex);
        if (!string.IsNullOrEmpty(this.DeleteConfirmationText) && this.ShowDeleteButton)
        {
            foreach (Control control in cell.Controls)
            {
                IButtonControl button = control as IButtonControl;
                if (button != null && button.CommandName == "Delete")
                    // Add delete confirmation
                    ((WebControl)control).Attributes.Add("onclick", string.Format
                    ("if (!confirm('{0}')) return false;", this.DeleteConfirmationText));
            }
        }
    }

    #region DeleteConfirmationText
    /// <summary>
    /// Delete confirmation text.
    /// </summary>
    [Category("Behavior")]
    [Description("The text shown to the user to confirm the deletion.")]
    public string DeleteConfirmationText
    {
        get { return this.ViewState["DeleteConfirmationText"] as string; }
        set { this.ViewState["DeleteConfirmationText"] = value; }
    }
    #endregion
}

Using the Code

You can then use the ExtendedCommandField in your GridView just as you would a normal column.

ASP.NET
<asp:GridView ID="grid" runat="server">
    <Columns>
        <asp:BoundField DataField="Name" HeaderText="Name" />
        <asp:BoundField DataField="StockLevel" HeaderText="Stock Level" />
        <Alex:ExtendedCommandField DeleteConfirmationText=
            "Are you sure you want to remove this item?" 
            HeaderText="Action" ShowDeleteButton="True" />
    </Columns>
</asp:GridView> 

Don't forget, of course, that you'll need a @Register directive at the top of the page so ASP.NET knows where to find the control.

Points of Interest

The InitializeCell method is a convenient way to customize the behaviour and appearance of GridView fields. More generally, one could easily extend the DataControlField to provide completely custom behaviour. One such extension I intend to develop soon is a DropDownListField which allows users to select values from a DropDownList within a GridView cell.

History

  • 06-Sep-07: First version

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Web Developer
United Kingdom United Kingdom
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
AnswerThis is a great custom control !! Thanks Pin
miraiyer9-Apr-14 4:47
miraiyer9-Apr-14 4:47 
QuestionHow to make command field work in the gridview1? Pin
Wu John11-Mar-13 3:31
Wu John11-Mar-13 3:31 
GeneralProblem: "Error Creating Control" Pin
Member 474288810-Jun-10 23:45
Member 474288810-Jun-10 23:45 
GeneralThanks! Pin
Biff_MaGriff2-Jun-10 11:37
Biff_MaGriff2-Jun-10 11:37 
GeneralGood idea Pin
Donsw13-Apr-09 9:44
Donsw13-Apr-09 9:44 
GeneralJust great Pin
ldelvasto3-Feb-09 5:36
ldelvasto3-Feb-09 5:36 
QuestionUser or Server Control? Pin
organicglenn22-Dec-08 11:57
organicglenn22-Dec-08 11:57 
GeneralDesigner problem Pin
miguel.hughes19-Nov-08 7:57
miguel.hughes19-Nov-08 7:57 
QuestionHow to disable DeleteButton? [modified] Pin
qwedster23-Oct-08 19:18
qwedster23-Oct-08 19:18 
QuestionQuick Question... Pin
JMirando28-Sep-08 2:12
JMirando28-Sep-08 2:12 
GeneralExcellent Pin
Leblanc Meneses20-Mar-08 19:45
Leblanc Meneses20-Mar-08 19:45 
GeneralSuperb! Pin
JayAdair14-Mar-08 13:17
JayAdair14-Mar-08 13:17 
GeneralThanks a lot!! Pin
Hacheka21-Feb-08 23:00
Hacheka21-Feb-08 23:00 
GeneralProps and Question Pin
ryanoc33321-Feb-08 9:42
ryanoc33321-Feb-08 9:42 
GeneralRe: Props and Question Pin
Alex Furmanski22-Feb-08 0:16
Alex Furmanski22-Feb-08 0:16 
GeneralThanks saved me tons of time on this Pin
codegalaxy16-Nov-07 4:53
codegalaxy16-Nov-07 4:53 
QuestionTemplateField? Pin
tmbgfan7-Sep-07 3:55
tmbgfan7-Sep-07 3:55 
AnswerRe: TemplateField? Pin
Alex Furmanski7-Sep-07 9:27
Alex Furmanski7-Sep-07 9:27 
GeneralRe: TemplateField? Pin
Larry Daniele31-Oct-08 10:15
Larry Daniele31-Oct-08 10:15 
GeneralUsefull Pin
NinjaCross6-Sep-07 5:05
NinjaCross6-Sep-07 5:05 

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

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