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

Using set_cancel() To Cancel Navigation

3 Answers 257 Views
Menu
This is a migrated thread and some comments may be shown as answers.
kencox
Top achievements
Rank 1
kencox asked on 21 Mar 2010, 11:38 PM
Hi folks,

I'm trying to prompt users to save unsaved fields in pages. The page navigates away even when I call eventArgs.set_cancel(true); 

The idea is that if you type something into the textbox and then click a menu item, you're prompted about the unsaved change.

Could someone point out what I'm missing here? The complete code for the page is shown below.

Thanks,

Ken

<%@ Page Language="VB" AutoEventWireup="false"  %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title></title>  
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
 
    <script type="text/javascript">  
        var isDirty = false;  
        var msg = 'This page has unsaved changes.\n\nClick OK to abandon the changes and leave the page.\n\nClick Cancel to stay on the page so you can save your changes.';  
 
        $(document).ready(function() {  
            $(':input').change(function() {  
                if (!isDirty) {  
                    isDirty = true;  
                }  
            });  
 
            //            window.onbeforeunload = function () {  
            //                if (isDirty) {  
            //                 confirm(msg);  
            //                }  
            //            };  
        });  
 
        function doNavigation(targetURL) {  
            if (isDirty == false) {  
                window.location.href = targetURL;  
            }  
            else {  
                if (confirm(msg) == false) {  
                    return false;  
                }  
                else {  
                    window.location.href = targetURL;  
                }  
            }  
        }  
 
        function onClicking(sender, eventArgs) {  
            var item = eventArgs.get_item();  
            var navigateUrl = item.get_navigateUrl();  
            if (navigateUrl && navigateUrl != "#" && isDirty) {  
                var proceed = confirm(msg);  
                if (!proceed) {  
                    eventArgs.set_cancel(true);  
                    return false;  
                }  
            }  
        }                 
    </script> 
 
</head> 
<body> 
    <form id="form1" runat="server">  
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
    </telerik:RadScriptManager> 
    <div> 
        <telerik:RadMenu ID="RadMenu1" runat="server" Skin="Web20" OnClientItemClicking="onClicking">  
            <Items> 
                <telerik:RadMenuItem EnableViewState="false" runat="server" NavigateUrl="~/dashboard.aspx" 
                    Text="Dashboard" PostBack="False">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" NavigateUrl="~/scheduling.aspx" PostBack="False" 
                            Text="Scheduling" /> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem PostBack="False" runat="server" NavigateUrl="~/contacts.aspx" 
                    Text="Contacts" /> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem PostBack="False" runat="server" NavigateUrl="~/items.aspx" Text="Items">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" NavigateUrl="~/resetitems.aspx" PostBack="False" 
                            Text="Debug: Reset Items" /> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem runat="server" NavigateUrl="~/sales.aspx" Text="Sales" PostBack="False" /> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem runat="server" NavigateUrl="~/purchases.aspx" Text="Purchasing" 
                    PostBack="False" /> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem runat="server" Text="Production" NavigateUrl="~/workorders.aspx" 
                    PostBack="False" /> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem runat="server" NavigateUrl="~/projects.aspx" Text="Projects" 
                    PostBack="False">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" NavigateUrl="~/files.aspx" PostBack="False" Text="Files" /> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem IsSeparator="true" /> 
                <telerik:RadMenuItem runat="server" NavigateUrl="~/events.aspx" Text="Events" PostBack="False">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" NavigateUrl="~/scheduling.aspx" PostBack="False" 
                            Text="Scheduling" /> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem IsSeparator="true" /> 
            </Items> 
        </telerik:RadMenu> 
        <br /> 
        <br /> 
        <br /> 
        <telerik:RadTextBox ID="RadTextBox1" Runat="server">  
        </telerik:RadTextBox> 
    </div> 
    </form> 
</body> 
</html> 
 

3 Answers, 1 is accepted

Sort by
0
Accepted
Yana
Telerik team
answered on 22 Mar 2010, 03:00 PM
Hi Ken Cox,

Please use the following code in your OnClicking method to cancel the navigation:

eventArgs.get_domEvent().preventDefault();

Greetings,
Yana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Piyush Bhatt
Top achievements
Rank 2
answered on 14 Jun 2011, 08:11 PM
this worked.

This should be included in the online document here:
http://demos.telerik.com/aspnet-ajax/menu/examples/programming/clientevents/defaultcs.aspx
and in local document here:
ms-help://telerik.aspnetajax.radcontrols.2010.Q1/telerik.aspnetajax.radmenu.2010.Q1/onclientitemclicking-client-side.html


0
Kate
Telerik team
answered on 17 Jun 2011, 01:16 PM
Hi Piyush,

Thank you for your suggestion.

We will make sure to include the necessary changes to our online demo.

Regards,
Kate
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Tags
Menu
Asked by
kencox
Top achievements
Rank 1
Answers by
Yana
Telerik team
Piyush Bhatt
Top achievements
Rank 2
Kate
Telerik team
Share this question
or