I have a project in which I dynamically load any one of about twenty different user controls into an ASP.net web page. Some of these user controls require Javascript functions in order to prepare various visual elements on the user control.
All of this was working perfectly but I've apparently changed something (I don't know what though!!) and now when the user control is loaded I get errors like this:
Microsoft JScript runtime error: 'radSlidingPane_BeforeExpand' is undefined
I don't think this is a Telerik specific problem. Rather, the Javascript functions defined at the top of the user control layout page just don't seem to be present at the time they're loaded. Various controls refer to these functions and when they don't
appear to be there, an error is generated.
I'm curious whether anyone has encountered a problem like this and, if so, whether you can point me in the right direction to fix it?
Why don't you catch (before it's loaded), which control(s) are being used. Then load the scripts first using RegisterStartUpScripts?
I do a similar thing but use MasterPages, and ensure the scripts are loaded before the controls. You have to be careful though becuase remember that if you have postbacks, scripts will be reset/changed, or not loaded at all if you use !IsPostBack.
HTH's
Regards,
BoogleC
Please mark the right solution as the answer. This helps others find what they're looking for.
I guess you have changed something in your script (script syntax error) or HTML source (any element is not completed).
Generally it happens when you've dynamic string (script) or Uncompleted tag or improper HTML nesting which causes page to break.
Is there anything about what I've described above that seems wrong to you? Why would a control referencing one of the Javascript functions fail to find it? This is what I cannot understand.
Thank you for those links. I will check them out. Incidentally, I just use the basic Microsoft Script Manager, not the Telerik one, and even though I use a few Telerik controls, I've never had a problem to date.
To get to the heart of the problem, I created a simple little user control with this layout code:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="FullFaceMining.ascx.cs" Inherits="DataEntry.UserControls.FullFaceMining" %>
<script type="text/javascript">
function radTreeView1_Test(sender, eventArgs) {
debugger
}
</script>
It doesn't actually "do" anything but it has the same pattern of a client-side event referring to a client-side event handler. Lo and behold, it also fails when it's loaded. So at least there's some consistency there.
But please believe me ... this was all working fine for the past 6 months!!! Suddenly and inexplicably, my project is seemingly unable to reference a user control's Javascript code now. Clearly I've changed something that has effected this problem but
what?!?
The idea of removing all of the Javascript from the layout page and instead loading it from my C# server-side code is appealing but, try as I might, I couldn't figure out how to resolve references like this:
var slidingZone = $find("<%= radSlidingZone.ClientID %>");
When situated in the layout code, it resolves fine but how to change this to be embedded in a server side string and then loaded by RegisterClientScriptBlock I do not know - and I tried for over 3 hours!!
Out of curiosity, I loaded up an earlier archive of my code in a separate directory and discovered something interesting, that may provide a clue to the solution. The old code was indeed running (ie. loading the Javascript functions correctly) BUT ONLY
when the user control was being automatically loaded via preset values. In other words, during debugging/development to reduce the time I needed to navigate down a treeview and select values in 2 dropdown listboxes, I just preset these values in code so when
I ran the project anew I'd already be starting where I wanted with sample data. BUT, when I removed the code to preset these values and had to navigate manually then EXACTLY the same problem as I'm now experiencing occurred!
Which begs my earlier question: Why, when Javascript code is embedded in a User Control, does it not load in time for assorted controls to reference it? Using the simple example I provided earlier, when the "OnClientDoubleClick" event handler definition
needs to seek out the "radTreeView1_Test" function it discovers that this function is not yet loaded.
rmdw
Participant
826 Points
1240 Posts
Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 07:05 AM|LINK
I have a project in which I dynamically load any one of about twenty different user controls into an ASP.net web page. Some of these user controls require Javascript functions in order to prepare various visual elements on the user control.
All of this was working perfectly but I've apparently changed something (I don't know what though!!) and now when the user control is loaded I get errors like this: Microsoft JScript runtime error: 'radSlidingPane_BeforeExpand' is undefined
I don't think this is a Telerik specific problem. Rather, the Javascript functions defined at the top of the user control layout page just don't seem to be present at the time they're loaded. Various controls refer to these functions and when they don't appear to be there, an error is generated.
I'm curious whether anyone has encountered a problem like this and, if so, whether you can point me in the right direction to fix it?
Hoping so,
Robert W.
Vancouver, BC
Technical Blog
Pocket Pollster
BoogleC
Contributor
2212 Points
447 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 11:22 AM|LINK
This might be down to your lifecycle process?
Why don't you catch (before it's loaded), which control(s) are being used. Then load the scripts first using RegisterStartUpScripts?
I do a similar thing but use MasterPages, and ensure the scripts are loaded before the controls. You have to be careful though becuase remember that if you have postbacks, scripts will be reset/changed, or not loaded at all if you use !IsPostBack.
HTH's
BoogleC
Please mark the right solution as the answer. This helps others find what they're looking for.
nilsan
All-Star
17538 Points
3824 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 11:32 AM|LINK
I guess you have changed something in your script (script syntax error) or HTML source (any element is not completed).
Generally it happens when you've dynamic string (script) or Uncompleted tag or improper HTML nesting which causes page to break.
Blog | Get your forum question answered | Microsoft Community Contributor 2011
rmdw
Participant
826 Points
1240 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 06:28 PM|LINK
Thanks for the feedback, folks. Perhaps we could go back to first principles.
With my user control layout page I use this syntax:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Development.ascx.cs" Inherits="DataEntry.UserControls.Development" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<link href="../../Styles/styles.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
// Javascript functions go here
</script>
// Layout code then goes here
Is there anything about what I've described above that seems wrong to you? Why would a control referencing one of the Javascript functions fail to find it? This is what I cannot understand.
Robert
Vancouver, BC
Technical Blog
Pocket Pollster
nilsan
All-Star
17538 Points
3824 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 06:57 PM|LINK
Please check this thread, it might be helpful to you :)
Also check out this if you're using UpdatePanel.
Blog | Get your forum question answered | Microsoft Community Contributor 2011
rmdw
Participant
826 Points
1240 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 07:36 PM|LINK
Thank you for those links. I will check them out. Incidentally, I just use the basic Microsoft Script Manager, not the Telerik one, and even though I use a few Telerik controls, I've never had a problem to date.
To get to the heart of the problem, I created a simple little user control with this layout code:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="FullFaceMining.ascx.cs" Inherits="DataEntry.UserControls.FullFaceMining" %>
<script type="text/javascript">
function radTreeView1_Test(sender, eventArgs) {
debugger
}
</script>
<telerik:RadTreeView ID="radTreeView1" runat="server" OnClientDoubleClick="radTreeView1_Test">
</telerik:RadTreeView>
It doesn't actually "do" anything but it has the same pattern of a client-side event referring to a client-side event handler. Lo and behold, it also fails when it's loaded. So at least there's some consistency there.
But please believe me ... this was all working fine for the past 6 months!!! Suddenly and inexplicably, my project is seemingly unable to reference a user control's Javascript code now. Clearly I've changed something that has effected this problem but what?!?
Robert
Vancouver, BC
Technical Blog
Pocket Pollster
rmdw
Participant
826 Points
1240 Posts
Re: Javascript Functions Not Available When Dynamically Loading a User Control
Dec 30, 2010 10:53 PM|LINK
Nilsan,
The idea of removing all of the Javascript from the layout page and instead loading it from my C# server-side code is appealing but, try as I might, I couldn't figure out how to resolve references like this:
var slidingZone = $find("<%= radSlidingZone.ClientID %>");
When situated in the layout code, it resolves fine but how to change this to be embedded in a server side string and then loaded by RegisterClientScriptBlock I do not know - and I tried for over 3 hours!!
Out of curiosity, I loaded up an earlier archive of my code in a separate directory and discovered something interesting, that may provide a clue to the solution. The old code was indeed running (ie. loading the Javascript functions correctly) BUT ONLY when the user control was being automatically loaded via preset values. In other words, during debugging/development to reduce the time I needed to navigate down a treeview and select values in 2 dropdown listboxes, I just preset these values in code so when I ran the project anew I'd already be starting where I wanted with sample data. BUT, when I removed the code to preset these values and had to navigate manually then EXACTLY the same problem as I'm now experiencing occurred!
Which begs my earlier question: Why, when Javascript code is embedded in a User Control, does it not load in time for assorted controls to reference it? Using the simple example I provided earlier, when the "OnClientDoubleClick" event handler definition needs to seek out the "radTreeView1_Test" function it discovers that this function is not yet loaded.
Why not? And how do I fix this??
Robert
Vancouver, BC
Technical Blog
Pocket Pollster