Introduction
Has there ever been a time when you wanted a popup message box to confirm before actually performing some action in a .NET DataGrid
?
I had a DataGrid
full of employees, with a Delete button and a whole lot of “Click-Happy” users. I bet you know the type. ;) I wanted a confirmation message box to appear when the Delete button was pressed. If they press “Yes”, then I delete the employee. If they press “Cancel”, then don’t perform the delete method.
Please note: There are plenty of ways to handle your JavaScript, this example shows how to put the client side confirmation all in the code-behind. Once you grasp the concept, you can then eliminate some of the steps that I've shown.
Here are the basic steps to take:
Step 1)
Add a DataGrid
to your aspx page:
<asp:datagrid id="myDataGrid" runat="server" width="512px">
<columns>
<asp:buttoncolumn text="Delete" buttontype="PushButton"
headertext="Delete Me"
commandname="Delete"></asp:buttoncolumn>
</columns>
</asp:datagrid>
Step 2)
Create your JavaScript confirmation message box. I did it in the code behind, but you can place your JavaScript in the aspx page if you like. I normally create a method like:
private void setupClientScript()
{
string js = @"
<script language=JavaScript>
function ConfirmDeletion()
{
return confirm('Are you sure you wish to delete this record?');
}
</script>";
if (!IsClientScriptBlockRegistered("ConfirmDeletion"))
{
RegisterClientScriptBlock( "ConfirmDeletion", js );
}
}
Step 3)
Call the method you just created to get it registered for the page. I usually do it in the Page_Load
method.
setupClientScript();
Step 4)
In the DataGrid
onItemDataBound
method, add the following:
if ( e.Item.ItemType == ListItemType.AlternatingItem
|| e.Item.ItemType == ListItemType.Item
|| e.Item.ItemType == ListItemType.SelectedItem )
{
e.Item.Cells[0].Attributes.Add( "onClick", "return ConfirmDeletion();" );
}
* Note the magic number [0] should be the column that the button is located.
Step 5)
Call your delete method. In your DataGrid
Command
method, add the following:
RemoveMe( int.Parse( e.Item.Cells[1].Text.ToString() ) );
* Note the magic number [1] is the column of my key value. I pass my key to the method RemoveMe
and perform my delete action there.
Download and look at the source code for a fully functional sample.
Dolph Larson is a Microsoft Certified Solution Developer (MCSD) for .Net, Microsoft Certified Application Developer (MCAD) and Microsoft Certified Database Administrator (MCDBA). He has over fourteen years of professional combined programming, database administration and information technology experience. He currently works as a senior developer for Omnicell and has worked as a senior web developer for eRealty.com. Dolph also managed the programming department for Health Help, Inc. and has seven years of managed health care experience and three years of energy experience.
Right now, I am developing Compact Framework applications for the PocketPC and Winodws Mobile. Go TO http://www.iPocketPC.net for FREE Pocket PC software!!!!!