This is a migrated thread and some comments may be shown as answers.
Show Confirm dialog on radtoolbar button click
3 Answers 65 Views
This is a migrated thread and some comments may be shown as answers.
Ivy
Top achievements
Rank 1
Ivy asked on 05 Mar 2013, 03:03 AM
Hi,

I want to open a confirm dialog on clicking a particular RadToolBar Button. Is this possible? Please help.

Thank you,
Ivy.

3 Answers, 1 is accepted

Sort by
0
Accepted
Princy
Top achievements
Rank 1
answered on 05 Mar 2013, 04:52 AM
Hello,

Please have a look at the following code I tried to display a confirm dialog when a RadToolBar Button is clicked.

ASPX:
<telerik:RadToolBar ID="RadToolBar" runat="server" OnClientButtonClicking="onClientButtonClicking"
    OnButtonClick="RadToolBar_ButtonClick">
    <Items>
        <telerik:RadToolBarButton runat="server" Text="File">
        </telerik:RadToolBarButton>
        <telerik:RadToolBarButton runat="server" Text="Exit">
        </telerik:RadToolBarButton>
    </Items>
</telerik:RadToolBar>

JavaScript:
<script type="text/javascript">
    function onClientButtonClicking(sender, args) {
        var radToolBar = $find("<%=RadToolBar.ClientID %>");
        var button = radToolBar.findItemByText("Exit");
        var ok = confirm("Are you sure you want to Exit?");
        if (ok)
            return true;
        else
            return args.set_cancel(true);
    }
</script>

Thanks,
Princy.
0
Danny
Top achievements
Rank 1
answered on 09 Jul 2018, 04:31 PM

Hello

 

I am having an issue with this. I only want to show the message on certain buttons that are clicked. E.g. are you sure you want to delete if the delete button is pressed. This example shows for every button that is clicked. 

 

<script type="text/javascript">
    function onClientButtonClicking(sender, args) {
        var radToolBar = $find("<%=RadToolBar1.ClientID %>");
        var button = radToolBar.findItemByValue("Delete");
        var ok = confirm("Are you sure you want to delete?");
        if (ok)
            return true;
        else
            return args.set_cancel(true);
    }
</script>

        <telerik:RadToolBar ID="RadToolBar1"  runat="server"
            OnButtonClick="RadToolBar1_ButtonClick" OnClientButtonClicking="onClientButtonClicking"  Width="100%" Height="100%" EnableEmbeddedSkins="true" Skin="Bootstrap">
            <Items>
                <telerik:RadToolBarButton Text="Return to Storage Policies" Value="return" ImageUrl="images/returntoolbar.png"></telerik:RadToolBarButton>
                   <telerik:RadToolBarButton Text="Save" ImageUrl="images/savetoolbar.png" Value="save"></telerik:RadToolBarButton>
                <telerik:RadToolBarButton IsSeparator="true"></telerik:RadToolBarButton>
                   
                    <telerik:RadToolBarButton Text="Delete" Value="delete" ImageUrl="images/deletetoolbar.png" ></telerik:RadToolBarButton>
            </Items>
        </telerik:RadToolBar>

 

 

 

0
Peter Milchev
Telerik team
answered on 10 Jul 2018, 02:16 PM
Hello Danny, 

The OnClientButtonClicking event handler has the clicked button in its arguments. That means you can show this dialog only if the value of the clicked item is "delete":

<script>
    function OnClientButtonClicking(sender, args) {
        var radToolBar = sender;
        var clickedButton = args.get_item();
        if (clickedButton.get_value() == "delete") {
            var ok = confirm("Are you sure you want to delete?");
            if (!ok) {
                args.set_cancel(true);
            }
        }
 
    }
</script>

Regards,
Peter Milchev
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Asked by
Ivy
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
Danny
Top achievements
Rank 1
Peter Milchev
Telerik team
Share this question
or