Remove From My Forums

Microsoft JScript runtime error: Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method

Question

User-230387691 posted

Whenever I run my site, the following error appears:

Microsoft JScript runtime error: Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method

The following is my code. Note that if I remove the block of code for the collapsible panel:

                                                        <ajaxToolkit:collapsiblepanelextender id="Collapsiblepanelextender1" runat="server"
                                                            TargetControlID="pnlBusinessHoursSettings"
                                                            Collapsed="True" ExpandControlID="pnlBusinessHoursSettingsHeader" CollapseControlID="pnlBusinessHoursSettingsHeader"
SuppressPostBack="true" TextLabelID="lblBusinessHoursSettings"
                                                            ExpandedText="Business Hours Settings [-]" CollapsedText="Business Hours Settings [+]" />

Then the error doesnt occur and the page appears to work fine.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="SiteConfiguration1.aspx.vb" Inherits="SiteConfiguration1" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!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 id="Head1" runat="server">
    <title>Site Configuration</title>
    <link href="../stylesheets/Intellistar.CSS" type="text/css" rel="stylesheet"/>
</head>
    
    <body style="margin-top:0px; margin-left:1px; margin-right:1px;" >
        <table id="MainTable" cellpadding="0" cellspacing="0" align="center" border="0" class="maintable">
            <tbody>
                <tr>
                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                        <form id="form1" runat="server">
                            <asp:ScriptManager id="scriptmanager1" enablepartialrendering="true" runat="Server" />
                                <div>
                                    
                                    <table id="Table1" cellpadding="0" cellspacing="0" style="width:989px; " runat="server">
                                        
                                       
                                        <tr>
                                            <td> </td>
                                        </tr>
                                        <tr>
                                            <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                <div>
                                                <asp:UpdatePanel ID="UpdatePanel4" runat="server" UpdateMode="Always">
                                                    <ContentTemplate>
                                                        <asp:Panel ID="pnlBusinessHoursSettingsHeader" runat="server" style="height:24px;width:989px;" BackColor="#1E4A96">
                                                             <asp:Label ID="lblBusinessHoursSettings" runat="server" CssClass="bglabel" Text="Business Hours Settings [+]" ForeColor="White"></asp:Label>
                                                        </asp:Panel>
                                                    </ContentTemplate>
                                                </asp:UpdatePanel>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Always">
                                                    <ContentTemplate>
                                                        <ajaxToolkit:collapsiblepanelextender id="Collapsiblepanelextender1" runat="server"
                                                            TargetControlID="pnlBusinessHoursSettings"
                                                            Collapsed="True" ExpandControlID="pnlBusinessHoursSettingsHeader" CollapseControlID="pnlBusinessHoursSettingsHeader" 
                                                            SuppressPostBack="true" TextLabelID="lblBusinessHoursSettings"
                                                            ExpandedText="Business Hours Settings [-]" CollapsedText="Business Hours Settings [+]"  />
                                                        <asp:Panel ID="pnlBusinessHoursSettings" runat="server" style="width:989px; " BorderColor="Transparent" BorderStyle="None" BorderWidth="1px">
                                                            <table id="tblBusinessHours" cellpadding="0" cellspacing="0" style="width:100%; border-style:solid; border-color:Black; border-width:1px" runat="server" >
                                                                <tr>
                                                                <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;"></td>
                                                                    <td colspan="2" style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                                        <asp:Label ID="Label1" runat="server" Font-Bold="true" Text="Holidays"></asp:Label>
                                                                    </td>
                                                                    
                                                                </tr>
                                                                <tr>
                                                                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                                         </td>
                                                                    
                                                                </tr>
                                                                <tr>
                                                                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;"></td>
                                                                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;"></td>
                                                                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                                        <asp:Label ID="Label2" runat="server" Text="Show Holidays for:"></asp:Label>
                                                                    </td>
                                                                    <td style="margin-top: 1px; padding-left: 0px; margin-left: 0px; padding-top: 1px; margin-bottom:0px; padding-bottom:0px;">
                                                                        <asp:DropDownList ID="dpdYearFilter" runat="server" AutoPostBack="True" OnSelectedIndexChanged="dpdYearFilter_SelectedIndexChanged"></asp:DropDownList>
                                                                    </td>
                                                                    
                                                                </tr>
                                                                
                                                            </table>
                                                        </asp:Panel>
                                                    </ContentTemplate>
                                                </asp:UpdatePanel>
                                            </td>
                                        </tr>
                                       
                                    </table>
                                        
                                </div>
                        </form>
                    </td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

Option Strict On

Partial Class SiteConfiguration1
    Inherits System.Web.UI.Page

#Region "Constants"

    Private Const c_intEarliestYear As Integer = 1990
    Private Const c_intYearsIntoFuture As Integer = 5

#End Region

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Load

        If Not Page.IsPostBack Then

            PageSetup()

        End If

    End Sub

    Private Sub PageSetup()

        LoadSiteSettings()

    End Sub

    Private Sub LoadSiteSettings()

        FillYearFilterDropdown()

        LoadHolidays()

    End Sub

    Private Sub FillYearFilterDropdown()

        Dim intYear As Integer
        For intYear = Today.Year + c_intYearsIntoFuture To c_intEarliestYear Step -1

            Dim itemYear As New ListItem
            itemYear.Text = intYear.ToString
            itemYear.Value = intYear.ToString
            dpdYearFilter.Items.Add(itemYear)

        Next

        'Add "All"
        Dim itemAll As New ListItem
        itemAll.Text = "Show All"
        itemAll.Value = ""
        dpdYearFilter.Items.Insert(0, itemAll)

        'Select the current year by default
        dpdYearFilter.SelectedValue = Today.Year.ToString

    End Sub

    Private Sub LoadHolidays()

        'Put code to load holidays here

    End Sub

    Protected Sub dpdYearFilter_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)

        LoadHolidays()

    End Sub

End Class

Any help or ideas would be much appreciated, thanks :)

Sunday, February 11, 2007 5:08 PM

All replies

0

Sign in to vote

User-230387691 posted

My appologies for an incomplete report of the details:

The error occurs when a "postback" event occurs (such as clicking a button or selecting a different index of a dropdownlist with autopostback = true.

As noted in the code, enablepartialrendering is set to true.

Also, the error always comes from ScriptResource.axd

Again thanks and sorry for the incomplete information in the first post.

Sunday, February 11, 2007 5:54 PM
0

Sign in to vote

User-230387691 posted

I have found the problem. It seems that since the control that expands the panel is inside its own update panel, thats what causes the error.

If I put the lblBusinessHoursSettings label outside an update panel, or if I put it in the same update panel as the panel that it is expanding (just before the collapsiblepanelextender for example), then the error doesnt happen.

Sunday, February 11, 2007 8:45 PM
0

Sign in to vote

User-2060598863 posted

Hi, anybody got any ideas with whats wrong with my codes?

I wrote it on the page load section...

            SqlDataSource1.ConflictDetection = "CompareAllValues"
            SqlDataSource1.ConnectionString="ConnectionStrings:convertionConnectionString"
            SqlDataSource1.OldValuesParameterFormatString = "original_{0}"
            SqlDataSource1.SelectCommand = "SELECT * FROM [firewall] ORDER BY [ID]"
            SqlDataSource1.UpdateCommand = "UPDATE [firewall] SET [ID] = @ID, [acknowledge] = @acknowledge, [source_port] = @source_port, [dest_port] = @dest_port, [source_ip] = @source_ip, [dest_ip] = @dest_ip, [protocol] = @protocol, [remarks] = @remarks WHERE [rank] = @original_rank"
            SqlDataSource1.UpdateParameters.Add(New Parameter("ID", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("acknowledge", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("source_port", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("dest_port", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("source_ip", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("dest_ip", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("protocol", TypeCode.String))
            SqlDataSource1.UpdateParameters.Add(New Parameter("remarks", TypeCode.Single))
            SqlDataSource1.UpdateParameters.Add(New Parameter("original_rank", TypeCode.String))

thanks!

Tuesday, June 5, 2007 5:09 AM
0

Sign in to vote

User1682583078 posted

Thanks dude. Your solution helped me to resolve issue.

I put CollapsiblePanelExtender, adn two panels (expand panel and collapse panel) in the same

UpdatePanel. That resovled the issue.

Thanks once again.

Monday, September 22, 2008 1:10 AM
0

Sign in to vote
User-773499721 posted

I had the same issue and just got it resolved so thought of replying here, may be it will help somebody else.

1. Place both OK and Cancel buttons outside the Update panel, otherwise when leaving the page you may get a JScript error "Microsoft JScript runtime error: Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method.".
When client-side objects of the Update Panel are being disposed, the cleanup script tries to remove all registered handlers. If buttons are inside of the UpdatePanel, their handlers are still registered as for all child controls by default, but weren’t re-attached during the callback. Obviously, you can spend time and do it properly, but simply re-placing the buttons will do the job while keeping layout appearance unaltered.

2. Now our buttons are outside of the UpdatePanel and we need to make it aware of relevant Click events. So we will have to add trigger to serve the OK operation:

<triggers>

<asp:AsyncPostBackTrigger ControlID="btnOK" eventname="click" />

</triggers>

Same will do for a Cancel operation but it will work just fine (and with less code) by setting ModalPopup.CancelControlID property.

3. In the case of the Cancel button a ModalPopup “window” will be closed automatically but if you want it to be closed after the OK click, you should do it manually by calling the mpMyPopup.Hide() method.

4. If databound controls were changed on a callback then don't forget to call the UpdatePanel.Update() method to refresh the data.

The resulting code is not the most efficient AJAX solution but it provides quite sophisticated business functionality at a reasonable price. Less additional code means less development time and less QA efforts as, if applied right, standard AJAX libraries are pretty robust.

source: http://lazyloading.blogspot.com/
Thursday, May 21, 2009 3:17 PM
0

Sign in to vote

User-405850685 posted

The easiest way to sort the problem is set the

<compilation debug="false">

in the Web.Config file.

if this set to true then the above exception will occur.

Regards

Narayanan

Thursday, January 14, 2010 2:42 AM
0

Sign in to vote
User-685459407 posted

I had the same issue and just got it resolved so thought of replying here, may be it will help somebody else.

1. Place both OK and Cancel buttons outside the Update panel, otherwise when leaving the page you may get a JScript error "Microsoft JScript runtime error: Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method.".
When client-side objects of the Update Panel are being disposed, the cleanup script tries to remove all registered handlers. If buttons are inside of the UpdatePanel, their handlers are still registered as for all child controls by default, but weren’t re-attached during the callback. Obviously, you can spend time and do it properly, but simply re-placing the buttons will do the job while keeping layout appearance unaltered.

2. Now our buttons are outside of the UpdatePanel and we need to make it aware of relevant Click events. So we will have to add trigger to serve the OK operation:

<triggers>

<asp:AsyncPostBackTrigger ControlID="btnOK" eventname="click" />

</triggers>

Same will do for a Cancel operation but it will work just fine (and with less code) by setting ModalPopup.CancelControlID property.

3. In the case of the Cancel button a ModalPopup “window” will be closed automatically but if you want it to be closed after the OK click, you should do it manually by calling the mpMyPopup.Hide() method.

4. If databound controls were changed on a callback then don't forget to call the UpdatePanel.Update() method to refresh the data.

The resulting code is not the most efficient AJAX solution but it provides quite sophisticated business functionality at a reasonable price. Less additional code means less development time and less QA efforts as, if applied right, standard AJAX libraries are pretty robust.

source: http://lazyloading.blogspot.com/

Thanks, this approach fixed the error for me.
Wednesday, March 10, 2010 1:30 PM
0

Sign in to vote

User298229698 posted

Excelente.

Thank you, this solved my problem.

Friday, October 16, 2015 3:38 PM

Asked by:

Microsoft JScript runtime error: Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method

Question

All replies