Click here to Skip to main content
13,342,876 members (52,642 online)
Click here to Skip to main content
Add your own
alternative version


53 bookmarked
Posted 7 Feb 2006

Easy Confirmation Message for .NET Controls

, 7 Feb 2006
Rate this:
Please Sign up or sign in to vote.
A JavaScript solution for a common routine, especially for those DataGrid/GridView Delete buttons.

Sample Image - confirmation.gif


This article describes adding a confirmation message to your server controls (even those inside your DataGrid) with one line of code (if that)!


I participate quite a bit on Experts-Exchange (ASP.NET), and always come across the question of how to attach a confirmation message to a Delete button, such as "Are you sure you want to delete this item?". While this is not a difficult task, it is a somewhat mundane one, and having to add an OnClick event to each Button in a DataGrid gets to be a bit much. Instead, I decided I wanted JavaScript to work for me and so it shall...

Using the code

The first step is create the JavaScript method that will handle all of this.

function confirmDelete(e) {    
    var targ;

    if (!e) var e = window.event;
    targ = ( ? : e.srcElement;
    if (targ.nodeType == 3) targ = targ.parentNode;

    if ("delete") >= 0) {        
        return confirm("Do you want to delete this item?");

document.onclick = confirmDelete;

The confirmDelete function is executed each time a click event occurs on the page. We then use some fun logic to get by the discrepancies in browsers to find the element that was clicked on. If that element has the word "delete" in it, then we launch our confirmation box with the message we see above.

The next step is to create a server control that gets affected by the logic above.

<asp:Button RunAt="server" ID="MyDeleteButton1" Text="Delete Record" />

This delete button will pop-up the confirmation box simply because we have included the word "Delete" in the ID. No code was required, amazing! We're done.

Now, imagine this with your DataGrid/GridView control; no need to attach that OnClick attribute in your ItemDataBound event, or for ASP.NET 2.0, the OnClientClick. We just throw the word "Delete" in the ID.

<!--<span class="code-comment"> ASP.NET 1.x --></span>

<asp:DataGrid RunAt="server" ID="GridView1">
        ... your other columns ...
                <asp:LinkButton RunAt="server" 

                       ID="DeleteMe" Text="Remove Row" />

<!--<span class="code-comment"> ASP.NET 2.0 --></span>

<asp:GridView RunAt="server" ID="GridView1">
        ... your other fields ...
                <asp:LinkButton RunAt="server" 

                       ID="DeleteMe" Text="Remove Row" />

You could place the confirmDelete function at the top of each page that you want to have this functionality.

<script type="text/javascript">
    ... confirmDelete function ...

Or even better, would be to place it in your JavaScript external script file. Then, you could throw it in your Master Page setup and have this feature on every page.

Another Method to Consider

If we didn't want to base everything on the ID of the server control, we could customize it to be assigned to the CSS class attribute. Using the code below, we can retrieve all elements that have a specified className.

function getElementsByClassName(ClassName,tagName,parentElement){
    var elements=new Array();
    var d=parentElement ? parentElement : document;
    var allElements;

        allElements=d.all && d.all.tags(tagName)
        || d.getElementsByTagName && d.getElementsByTagName(tagName);
    else allElements=d.all || d.getElementsByTagName("*");

    for(var i=0,len=allElements.length; i<len; i++)

    return elements;
function assignConfirm(className) {    
    var elements = getElementsByClassName(className);
    if (elements && elements.length > 0) {
        for (i=0; i<elements.length; i++) 
            elements[i].onclick = confirmDelete;
function confirmDelete() {
    return confirm("Are you sure you want to delete this item?");

Then assignConfirm function will get executed on the page load and assign a new confirmDelete function (a much more simplified one) to the onClick event for each matching element (including server controls in a DataGrid). The only thing left to do is call it.

<body onload="assignConfirm('delete');">

Finally, an example server control that utilizes this alternative method...

<asp:LinkButton RunAt="server" ID="lbRemove" CssClass="delete" Text="Remove Item" />

That's it. Now we're able to assign the same functionality as before, but using CSS classes to control which controls get this feature. It'd be very easy to tweak this method to toggle multiple messages by simply changing the CssClass name and assigning a separate confirmDelete function.


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

Jason Scolaro
Web Developer
United States United States
ASP.NET/VB.NET Developer. Constant contributor to Experts-Exchange in the ASP.NET topic area.

You may also be interested in...


Comments and Discussions

GeneralMy vote of 5 Pin
Meysampaknahad10-Nov-11 9:01
memberMeysampaknahad10-Nov-11 9:01 
Generalhello Pin
aditya_asv7-Sep-07 21:22
memberaditya_asv7-Sep-07 21:22 
GeneralMuch Simpler and No button Pin
VEMS16-Jan-07 6:36
memberVEMS16-Jan-07 6:36 
QuestionConfirm Delete action with IE7 Pin
Rlearning8-Nov-06 11:30
memberRlearning8-Nov-06 11:30 
Questioni need a help from u guys immediately Pin
asenthil25-Sep-06 20:57
memberasenthil25-Sep-06 20:57 
GeneralButtonColumn Pin
fuhaizah14-Mar-06 18:28
memberfuhaizah14-Mar-06 18:28 
GeneralRe: ButtonColumn Pin
Kilhoffer30-Mar-06 5:49
memberKilhoffer30-Mar-06 5:49 
GeneralRe: ButtonColumn Pin
Jason Scolaro30-Mar-06 8:25
memberJason Scolaro30-Mar-06 8:25 
GeneralRe: ButtonColumn Pin
Jason Scolaro30-Mar-06 8:27
memberJason Scolaro30-Mar-06 8:27 
GeneralOther Actions Pin
munklefish4-Mar-06 3:46
membermunklefish4-Mar-06 3:46 
GeneralRe: Other Actions Pin
Jason Scolaro4-Mar-06 6:07
memberJason Scolaro4-Mar-06 6:07 
GeneralRe: Other Actions Pin
munklefish4-Mar-06 7:44
membermunklefish4-Mar-06 7:44 
QuestionAlternate method: OnClientClick in 2.0?? Pin
clausn14-Feb-06 12:52
memberclausn14-Feb-06 12:52 
AnswerRe: Alternate method: OnClientClick in 2.0?? Pin
Jason Scolaro14-Feb-06 17:36
memberJason Scolaro14-Feb-06 17:36 
Generalredirect issue Pin
tengtium7-Feb-06 15:43
membertengtium7-Feb-06 15:43 
GeneralRe: redirect issue Pin
Jason Scolaro7-Feb-06 17:55
memberJason Scolaro7-Feb-06 17:55 

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.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.180111.1 | Last Updated 7 Feb 2006
Article Copyright 2006 by Jason Scolaro
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid