Solved

AJAX Animation causing IE to display "Errors on page" in status bar

Posted on 2007-03-21
9
991 Views
Last Modified: 2013-11-26
I am playing with the ajax animation extender.  I have a simple web page with a couple updatepanels, a drop down, and a textbox.  When ever I click the 'Show Panel' button on the page the panel fades in as it is supposed to.  There is a close button on the panel that will cause the panel to fade out.   If I click Show then Close  then Show again IE will say "Error on page" on line 793.  There is no line 793 on my page.  


This is my page

<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
   
 
    <style type="text/css">
  <!--
    .flyout {position: absolute; left: 300px; top: 50px; border: thin solid  black;  height:300px; width:300px;   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);}
   
   
    -->
 </style>

   
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
            &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
           
           
        <asp:FormView ID="FormView1" runat="server" DefaultMode="Insert" Width="268px">
            <EditItemTemplate>
                FName:
                <asp:TextBox ID="FNameTextBox" runat="server" Text='<%# Bind("FName") %>'>
                </asp:TextBox><br />
                LName:
                <asp:TextBox ID="LNameTextBox" runat="server" Text='<%# Bind("LName") %>'>
                </asp:TextBox><br />
                <asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True" CommandName="Update"
                    Text="Update">
                </asp:LinkButton>
                <asp:LinkButton ID="UpdateCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
                    Text="Cancel">
                </asp:LinkButton>
            </EditItemTemplate>
            <InsertItemTemplate>
                FName:
                <asp:TextBox ID="FNameTextBox" runat="server" Text='<%# Bind("FName") %>'>
                </asp:TextBox>
                &nbsp; &nbsp; &nbsp;<br />
                &nbsp;
                LName:&nbsp;<asp:TextBox ID="LNameTextBox" runat="server" Text='<%# Bind("LName") %>'>
                </asp:TextBox>
                <br />
                <br />
                Other Stuff
                <asp:DropDownList ID="DropDownList1" runat="server">
                </asp:DropDownList>
                <asp:SqlDataSource ID="drop" runat="server" ConnectionString="<%$ ConnectionStrings:testDb %>"
                    SelectCommand="SELECT [otherstuff] FROM [names]"></asp:SqlDataSource>
                &nbsp;<br />
                <br />
                <asp:Button ID="Button1" runat="server" CommandName="INSERT" Text="Do It.   Do It." /><br />
                <br />
                <br />
                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
                <asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" CommandName="Insert"
                    Text="Insert" OnClick="InsertButton_Click">
                </asp:LinkButton>
            </InsertItemTemplate>
            <ItemTemplate>
                FName:
                <asp:Label ID="FNameLabel" runat="server" Text='<%# Bind("FName") %>'></asp:Label><br />
                LName:
                <asp:Label ID="LNameLabel" runat="server" Text='<%# Bind("LName") %>'></asp:Label><br />
                <asp:LinkButton ID="NewButton" runat="server" CausesValidation="False" CommandName="New"
                    Text="New">
                </asp:LinkButton>
            </ItemTemplate>
        </asp:FormView>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="reload" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="addbutton" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
        &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;<br />
       
         
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
        <ContentTemplate>
                 
       <div class="flyout" id="Panel1">
            Add to dropdown<br />
            <asp:TextBox ID="Paneladdme" runat="server"></asp:TextBox>
            <asp:Button ID="addbutton" runat="server" OnClick="PaneladdButton_Click" Text="Add" />&nbsp;<br />
           
           
            <asp:Button ID="close" runat="server" OnClick="closebuttonclick" Text="Close" />&nbsp;<br />
        &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;<br />
        <br />
   
   
       
       </div>
       
       </ContentTemplate>
     
     
                   
   
        </asp:UpdatePanel>
       
        <br />
       
       
        <asp:Button ID="show" runat="server" OnClientClick="return false;" Text="Show Panel"/><br />
        <asp:Button ID="reload" runat="server"  Text="Refresh" /><br />
        &nbsp;<ajaxToolkit:AnimationExtender ID="AnimationExtender3" runat="server" TargetControlID="show">

        <Animations>
           <OnClick>
             <Sequence>
             
             <Pulse AnimationTarget="Panel1" Duration=".05" Iterations="2"/>
               
             </Sequence>
           </OnClick>
        </Animations>
           </ajaxToolkit:AnimationExtender>  
           
                     
    </form>  
</body>
</html>
0
Comment
Question by:skykingjwc
9 Comments
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 18766353
I'm not a .net expert but it is obvious that you are using server side script too.  The line in the error is as the browser sees the page.  In other words use View Source in the browser to see the content the browser gets.  In that content you probably have a line 793.  What is on that line?  Hopefully you can get a more specific error too.  If you double click on the bottom, left of the browser (Error on Page part) does that box show an error message?

Show us the html source code for that part of the page and point out the line.  If there is a better error in the box then provide it please.  You may also need to provide html source for other parts of the page (i.e. script tags, etc) for functions, etc used on those lines.

Let me know if you have a question.

bol
0
 
LVL 4

Author Comment

by:skykingjwc
ID: 18766391
There is no line 793 in the source.  Not even close.

IE Reports the following error.  

Line: 793
Char: 9
Error: Member not found
Code: 0
URL : http://localhost:2125/AJAXTesting/Default.aspx

SOURCE FROM IE (as you can see there is no line 793)



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
      Untitled Page
</title>
   
 
    <style type="text/css">
  <!--
    .flyout {position: absolute; left: 300px; top: 50px; border: thin solid  black;  height:300px; width:300px;   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);}
   
   
    -->
 </style>

   
</head>
<body>
    <form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE3MDI3NDkwMTgPZBYCAgMPZBYCAgMPZBYCZg9kFgICAQ88KwAKAQAPFgQeC18hRGF0YUJvdW5kZx4LXyFJdGVtQ291bnRmZBYCZg9kFgZmDw8WAh4HVmlzaWJsZWhkZAIBD2QWAmYPZBYCAgUPEA8WAh8AZ2RkZGQCAg8PFgIfAmhkZBgBBQlGb3JtVmlldzEPFCsABmRkAgJkZBYAZPUWQspeGDKLMf5A5UVE6faNtWsN" />
</div>

<script type="text/javascript">
<!--
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
// -->
</script>


<script src="/AJAXTesting/WebResource.axd?d=vnGi0rZactWuf4iIBo-lDw2&amp;t=633082757652716716" type="text/javascript"></script>


<script src="/AJAXTesting/ScriptResource.axd?d=boEap2lX9ZDAMPqUDGlbkyuWRgUl3n9kgWUc3IP5ibO7N7f_gjpF-Rcx5i7VDcthdK59t2dLtQqmbrEI3dpyvfBGPC6_t0d5H8H5FtX4te81&amp;t=633083423066554545" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=boEap2lX9ZDAMPqUDGlbkyuWRgUl3n9kgWUc3IP5ibO7N7f_gjpF-Rcx5i7VDcthdK59t2dLtQqmbrEI3dpyvfXGmiWvt1wnpBXVBAIbmcWn6l0nImBKQOI2gMObFdhA0&amp;t=633083423066554545" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=6GSy8RXt1hzTkvjrB3svrPqhhogGQXGsL4vKVZsf50P0UM5mu_AbOjcFSZe2m9k3BbvUrqQ0_GPYAl43SrQ6rw2&amp;t=633059379600000000" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=6GSy8RXt1hzTkvjrB3svrPqhhogGQXGsL4vKVZsf50PKvxGHWvXUUj1FgA_h1cFtvLNTRYIElTGFyFYkcnzMoA2&amp;t=633059379600000000" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=6GSy8RXt1hzTkvjrB3svrPqhhogGQXGsL4vKVZsf50Mci8vWYhWq5VCdu5jTUtokykfbbWth3neqMQmBwPn6Ug2&amp;t=633059379600000000" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=6GSy8RXt1hzTkvjrB3svrPqhhogGQXGsL4vKVZsf50N626i61wLoq1TF88mp9grAVS-ocl-Q3qqQFTpT_SPt2mKh-kph2Hg4FZL8PJcJ15k1&amp;t=633059379600000000" type="text/javascript"></script>
<script src="/AJAXTesting/ScriptResource.axd?d=6GSy8RXt1hzTkvjrB3svrPqhhogGQXGsL4vKVZsf50Mci8vWYhWq5VCdu5jTUtok12bg29KueDW2CUohK-LrlHP5FtMd1DIi5SouJQId3k41&amp;t=633059379600000000" type="text/javascript"></script>
        <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ScriptManager1', document.getElementById('form1'));
Sys.WebForms.PageRequestManager.getInstance()._updateControls(['tUpdatePanel1','tUpdatePanel2'], ['reload','addbutton'], [], 90);
//]]>
</script>

            &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;
        <div id="UpdatePanel1">
      
           
           
        <table cellspacing="0" border="0" id="FormView1" style="width:268px;border-collapse:collapse;">
            <tr>
                  <td colspan="2">
                FName:
                <input name="FormView1$FNameTextBox" type="text" id="FormView1_FNameTextBox" />
                &nbsp; &nbsp; &nbsp;<br />
                &nbsp;
                LName:&nbsp;<input name="FormView1$LNameTextBox" type="text" id="FormView1_LNameTextBox" />
                <br />
                <br />
                Other Stuff
                <select name="FormView1$DropDownList1" id="FormView1_DropDownList1">

                  </select>
               
                &nbsp;<br />
                <br />
                <input type="submit" name="FormView1$Button1" value="Do It.   Do It." id="FormView1_Button1" /><br />
                <br />
                <br />
                <span id="FormView1_Label1">Label</span><br />
                <a id="FormView1_InsertButton" href="javascript:__doPostBack('FormView1$InsertButton','')">Insert</a>
            </td>
            </tr>
      </table>
           
</div>
        &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;<br />
       
         
        <div id="UpdatePanel2">
      
                 
       <div class="flyout" id="Panel1">
            Add to dropdown<br />
            <input name="Paneladdme" type="text" id="Paneladdme" />
            <input type="submit" name="addbutton" value="Add" id="addbutton" />&nbsp;<br />
           
           
            <input type="submit" name="close" value="Close" id="close" />&nbsp;<br />
        &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;<br />
        <br />
   
   
       
       </div>
       
       
</div>
       
        <br />
       
       
        <input type="submit" name="show" value="Show Panel" onclick="return false;" id="show" /><br />
        <input type="submit" name="reload" value="Refresh" id="reload" /><br />
        &nbsp;  
           
                     
   
<div>

      <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWCgKw2eajDQKytfK4CgL069ApArrQ09gDAov75dsMAuqCyQYC2d7PiQwCx/yG/QwCvIvsxA4CocSp8QX0iQfbLl0RiLTp5FlWP3isgtU6rg==" />
</div>

<script type="text/javascript">
<!--
Sys.Application.initialize();
Sys.Application.add_init(function() {
    $create(AjaxControlToolkit.Animation.AnimationBehavior, {"OnClick":"{\"AnimationName\":\"Sequence\",\"AnimationChildren\":[{\"AnimationName\":\"Pulse\",\"AnimationTarget\":\"Panel1\",\"Duration\":\".05\",\"Iterations\":\"2\",\"AnimationChildren\":[]}]}","id":"AnimationExtender3"}, null, null, $get("show"));
});
// -->
</script>
</form>  
</body>
</html>



0
 
LVL 29

Expert Comment

by:Badotz
ID: 18767167
Oh, there is a line 793 - it just isn't where you are expecting it.

Step through the code with a debugger to find the *real* problem.
0
 
LVL 3

Expert Comment

by:exoska
ID: 18767646
the error is probably in one of the /AJAXTesting/ScriptResource.axd s included, as seen on source.

you might want to consider some javascript error handling functions, and re attach the event handlers to the buttons on js failure
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 
LVL 4

Author Comment

by:skykingjwc
ID: 18768968
A little new to AJAX and ASP here.   Converted from PHP recently.   I am not quite sure how to use VS 2005 to step through the program.   I did figure out the problem myself though.    If you could provide some instruction on how to debug in VS or a link to some instructions or somethign that would be great.
0
 
LVL 54

Accepted Solution

by:
b0lsc0tt earned 500 total points
ID: 18772167
I haven't used VS yet but here are some good sites with information on the using the debugger.

http://www.odetocode.com/Articles/425.aspx
http://msdn2.microsoft.com/en-us/library/k2h50zzs(VS.80).aspx
http://aspalliance.com/1096_Debugging_JavaScript_in_Visual_Studio

Let me know how those help or if you need something a little different.

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 18772185
The second link is not handled correctly by EE.  It should include the part in parentheses and the filename extension.  You will need to copy the URL to your browser's address bar instead of clicking on the link EE makes.

http://msdn2.microsoft.com/en-us/library/k2h50zzs(VS.80).aspx
0
 
LVL 4

Author Comment

by:skykingjwc
ID: 18772922
Nice that was exactly what I was looking for.  I just didn't know the correct terminology.
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 18773126
Great!  I'm glad I could help.  Thanks for the grade, the points and the fun question.

bol
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now