This is a migrated thread and some comments may be shown as answers.

Conditional Confirm Dialog for GridButtonColumn

2 Answers 322 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 11 Dec 2009, 05:41 PM

Requirements

RadControls version

2009.1.402.35

.NET version

3.5 SP1

Visual Studio version

2008 SP1

programming language

VB.NET / JavaScript

browser support

all browsers supported by RadControls


PROJECT DESCRIPTION
I was recently tasked to display a list of data in a rad grid and alert users if a change they were about to apply would have other changes that might impact the system globally. One of the things that I love about the RadGrid is the integration with RadWindow and the ability to add a confirm dialog before performing a command in the datagrid. However, I needed a way to conditionally set this to alert users only when the change they wanted to apply would affect other places in the system. If the change didn't impact other areas of the system, there was no reason to alarm the user.

Initially, I set up my RadGrid as follows:
        <telerik:RadGrid ID="gridFundList" runat="server" AllowMultiRowSelection="false" 
            AllowAutomaticDeletes="false" AllowAutomaticInserts="false" AllowAutomaticUpdates="false" 
            AllowFilteringByColumn="false" AllowPaging="false" AllowSorting="false" ShowGroupPanel="false" 
            ShowFooter="false" ShowHeader="true" ShowStatusBar="true">  
            <MasterTableView DataKeyNames="FundID" AutoGenerateColumns="false" ShowFooter="true">  
                <Columns> 
                    <telerik:GridButtonColumn UniqueName="Toggle" ButtonType="ImageButton" ImageUrl="~/images/buttonicons/lightbulb_off.png" 
                        CommandName="ToggleReadable" ConfirmDialogType="RadWindow" ConfirmText="Are you sure you wish to change the global access settings for this fund?<br/><br/><strong>All</strong> applied rules for individual users <strong>will be</strong> removed.<br/><br/>Click <strong>OK</strong> to continue." 
                        ConfirmTitle="Change Global Settings">  
                        <ItemStyle Width="30px" /> 
                    </telerik:GridButtonColumn> 
                    <telerik:GridBoundColumn UniqueName="FundID" DataField="FundID" DataFormatString="{0:00}" 
                        HeaderText="Fund">  
                        <ItemStyle Width="75px" HorizontalAlign="Center" VerticalAlign="Top" /> 
                        <HeaderStyle HorizontalAlign="Center" /> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn UniqueName="Desc" DataField="FundName" HeaderText="Description">  
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn UniqueName="Count" DataField="TotalCostCenterItemsInFund" 
                        HeaderText="Items In Fund" DataFormatString="{0:#,##0} items found." Aggregate="Sum">  
                        <ItemStyle HorizontalAlign="Right" Width="125px" /> 
                        <FooterStyle HorizontalAlign="Right" /> 
                        <HeaderStyle HorizontalAlign="Center" /> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn UniqueName="RuleCount" DataField="FundRulesApplied" HeaderText="Rules Applied" 
                        DataFormatString="{0:#,##0} rules applied." Aggregate="Sum">  
                        <ItemStyle HorizontalAlign="Right" Width="125px" /> 
                        <FooterStyle HorizontalAlign="Right" /> 
                        <HeaderStyle HorizontalAlign="Center" /> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn UniqueName="CreateDate" DataField="CreateDate" DataFormatString="{0:d} at {0:t}" 
                        HeaderText="Created">  
                        <ItemStyle Width="150px" /> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn UniqueName="ModifyDate" DataField="ModifyDate" DataFormatString="{0:d} at {0:t}" 
                        HeaderText="Modified">  
                        <ItemStyle Width="150px" /> 
                    </telerik:GridBoundColumn> 
                </Columns> 
            </MasterTableView> 
        </telerik:RadGrid> 
 

This worked great, but every time a user clicked on the ToggleReadable command they were prompted that they might remove existing rules. I could imagine a scenario where I would be receiving calls every time a user wanted to make a change, afraid they were about to break something.

After investigating the HTML output, I discovered how easy this really is to implement on a conditional basis. Hopefully this will be helpful to others. The output generated an onclick event for the image button with the following javascript:

if(!$find('<GridID>').confirm('<Message>', event, '<Window Title>'))return false

This code needed to be placed on the ImageButtons that needed a confirm dialog box.

To start, remove the ConfirmDialogType, ConfirmText and ConfirmTitle attributes of the GridButtonColumn.
<telerik:GridButtonColumn UniqueName="Toggle" ButtonType="ImageButton"   
     ImageUrl="~/images/buttonicons/lightbulb_off.png" 
     CommandName="ToggleReadable">  
          <ItemStyle Width="30px" /> 
</telerik:GridButtonColumn> 
 

Then handle the ItemDataBound event of the RadGrid with code similar to the following:
    Protected Sub gridFundList_ItemDataBound(ByVal sender As ObjectByVal e As Telerik.Web.UI.GridItemEventArgs) Handles gridFundList.ItemDataBound  
        If e.Item.ItemType = Telerik.Web.UI.GridItemType.AlternatingItem Or e.Item.ItemType = Telerik.Web.UI.GridItemType.Item Then 
            Dim item As TUI.GridDataItem = DirectCast(e.Item, TUI.GridDataItem)  
            Dim data As Fund = item.DataItem  
 
            Dim btnToggle As ImageButton = DirectCast(item("Toggle").Controls(0), ImageButton)  
 
                If data.FundRulesApplied > 0 Then 
                   ' This will affect other areas of the system.  
                   ' Alert the user!  
                    Dim message As String = "This change will impact other places in the system. Click OK to continue."   
                    btnToggle.Attributes.Add("onclick""if(!$find('" & gridFundList.ClientID & "').confirm('" & message & "', event, 'Change Global Settings'))return false;")  
                End If 
        End If 
    End Sub 
 

2 Answers, 1 is accepted

Sort by
0
Iana Tsolova
Telerik team
answered on 15 Dec 2009, 11:15 AM
Hi Chris,

Thank you for sharing your experience with the community. I hope other users find your sample useful.

Additionally, I have updated your Telerik points. 


Greetings,
Iana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Quesnay MALANDA
Top achievements
Rank 1
answered on 22 Mar 2010, 12:14 PM
thank you!
Tags
Grid
Asked by
Chris
Top achievements
Rank 1
Answers by
Iana Tsolova
Telerik team
Quesnay MALANDA
Top achievements
Rank 1
Share this question
or