Getting an IE javascipt error that I think is originating from the UltraWebMenu.
I need a means to warn a user that changes were made to a form, and give them a chance to cancel whatever operation they were doing to exit the form.
Found some examples that use the javascript window.onbeforeunload event. This event is called in just about every case. It works for some controls but I'm having trouble with a couple Infragistics controls throwing a javascript error.
To reproduce the problem, All you need is a WebForm with an UtlraWebMenu (with just 1 item to do a post back) an edit box and a regular asp.net button.
Here is the mainpage source...
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="JavaScriptPlayground._Default" %><%@ Register assembly="Infragistics35.WebUI.UltraWebNavigator.v8.1, Version=8.1.20081.1000, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.WebUI.UltraWebNavigator" tagprefix="ignav" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script type="text/javascript" language="javascript" id="test"> var bModified = false; window.onbeforeunload = confirmExit; function setModified(modified) { bModified = modified; } function confirmExit() { if (bModified) { return "Modifications were made and not saved. All changes will be lost."; } } </script> <html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body > <form id="form1" runat="server"> <div> <ignav:UltraWebMenu ID="UltraWebMenu1" runat="server" JavaScriptFilename="" JavaScriptFileNameCommon="" LeafItemImageUrl="" onmenuitemclicked="UltraWebMenu1_MenuItemClicked" ParentItemImageUrl="" StyleSetName=""> <IslandStyle BackColor="LightGray" BorderStyle="Outset" BorderWidth="1px" Cursor="Default"> </IslandStyle> <HoverItemStyle BackColor="DarkBlue" Cursor="Default" ForeColor="White"> </HoverItemStyle> <Images> <SubMenuImage Url="ig_menuTri.gif" /> </Images> <ItemStyle Cursor="Default" /> <Items> <ignav:Item Text="File"> <Items> <ignav:Item Text="Test Post Back"> </ignav:Item> </Items> </ignav:Item> </Items> <DisabledStyle Font-Names="MS Sans Serif" Font-Size="8pt" ForeColor="Gray"> </DisabledStyle> <Levels> <ignav:Level Index="0" /> <ignav:Level Index="1" /> </Levels> <SeparatorStyle BackgroundImage="ig_menuSep.gif" CssClass="SeparatorClass" CustomRules="background-repeat:repeat-x; " /><ExpandEffects ShadowColor="LightGray"></ExpandEffects><MenuClientSideEvents InitializeMenu="" ItemChecked="" ItemClick="" SubMenuDisplay="" ItemHover=""></MenuClientSideEvents> </ignav:UltraWebMenu> </div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <br /> <asp:Button ID="Button2" runat="server" Text="Post Back" onclick="Button2_Click" /> </form> </body></html>
In the code-behind I have a couple postback events to prove if the OK/Cancel prompt is working properly and also I wireup the textbox onkeypress
here is the code-behind
using System;using System.Collections;using System.Configuration;using System.Data;using System.Linq;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.HtmlControls;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Xml.Linq;using System.Text;namespace JavaScriptPlayground{ public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { this.TextBox1.Attributes.Add("onkeypress", "setModified(true);"); } protected void Button2_Click(object sender, EventArgs e) { DoSomething(); } protected void UltraWebMenu1_MenuItemClicked(object sender, Infragistics.WebUI.UltraWebNavigator.WebMenuItemEventArgs e) { DoSomething(); } private void DoSomething() { //do domething in the postback int y = 0; y++; } }}
Once you type in the editbox, a flag is set in javascript that is checked in the OnBeforeUnload event. The function returns a message that is displayed automatically by the browser warning of changes not being saved. If you click the button (which causes a postback) everything works as expected. However, if you type in the textbox and click on the file menu, when you hit "Cancel" it will still attempt the postback and throws a javascript error "htmlfile: Unspecified error." In __doPostBack which is called from igmenu_mouseup.
Any ideas on how I could fix this or an alternative solution would be greatly appreciated. Is there a way to cancel the UltraMenu items postback? I get the same javascript error with the UltraListBar when clicking a Group->Item but figured if we can fix one, might be able to figure out how to fix the other.
Thanks in advance.
Do you have a solution for this? I'm receiving the exact error with IG's 2009.1 ASP.NET controls.
Nobody ever replied to my post so we ended up having to handle infragistics control events and add javascript code to handle it ourselves.
For the menu, we handled it in the ItemClick event something like
function uwmMenu_ItemClick(menuId, itemId){
// grab menu and item objects var oMenu = igmenu_getMenuByItemId(itemId); var oItem = igmenu_getItemById(itemId);
// logic to validate click
if (ValidateMenuBarClick(oItem.getTag()) == false) { // click wasn't valid, so exit return true; }
// some logic to ensure that its not an item that should perform a postback without prompting to
// save
if (MenuBypassPromptToSave(itemId) == true) { // set flag so Prompt isn't fired in MainForm.ConfirmExit setPromptToSave(false); return; }
// the core logic to display a message prompting user and handle according to their choice
if ((bModified == true) && (bPromptToSave == true)) { if (ShowModificationsPrompt()) { // set flag so Prompt isn't fired in MainForm.ConfirmExit setPromptToSave(false); } else { // user clicked cancel, so cancel postback oMenu.CancelPostBack = true; oMenu.NeedPostBack = false; } }
}
function ShowModificationsPrompt() { if (confirm('Are you sure you want to navigate away from this page?\n\nThere are unsaved changes on the current page. If you continue, all changes will be lost.\n\nPress OK to continue, or Cancel to stay on the current page.')) return true; else return false; }
We had to put logic like this anywhere screen navigation was handled via an Infragistics control (menu, treeview, etc, etc).
Hope this helps. There probably is a cleaner, easier solution but nobody helped so we had to improvise.
Goodluck!!
We have a workaround which works at the moment. After reviewing the Javascript error in IG's code, which made it not possible to embed a try..catch without the source code. So what we ended up doing was the following:
if (isIE) { Sys.Application.add_load(function () { var form = theForm; form.submit = function () { try { if (typeof ig_controls == 'object') for (var id in ig_controls) ig_controls[id]._onIgSubmit();
// this block was outside the try..catch block if (this._ig_submit) this._ig_submit(); // <- exception } catch (e) { } } });}