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

clientside script does not work when loaded from from external file

8 Answers 76 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Alex
Top achievements
Rank 1
Alex asked on 27 Sep 2008, 11:33 PM
Hello,

I tried moving all of the JavaScript functions out to an external file and reference it like this:

<head id="Head1" runat="server"
... 
<script type="text/javascript" src="MyScriptFile.js"</script> 
</head> 

and none of the functions work. The script file is in my web project directory. When I examine with IE Developer Toolbar, I see error messages with my vars set to null when the functions are called:

for example:
tree is null

However, when I include the script inside my aspx page, everything works.
What am I doing wrong?

Best Regards,
Alex

8 Answers, 1 is accepted

Sort by
0
Vlad
Telerik team
answered on 29 Sep 2008, 06:29 AM
Hi Alex,

How the "tree" variable is initialized?

All the best,
Vlad
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Alex
Top achievements
Rank 1
answered on 29 Sep 2008, 03:10 PM
Hi Vlad,

This is my code:

function OnKeyPressingInTree(sender, eventArgs) 
       // var node = eventArgs.get_node();   
       // var key = eventArgs.get_domEvent().keyCode;    
        
       var key = eventArgs.get_domEvent().keyCode; 
        
       if(key == "40")  // down-arrow 
       {   
          var tree = $find("<%= RadTreeView1.ClientID %>"); 
          var node = tree.get_selectedNode(); 
          var nextNode = node.get_nextNode(); 
           

and the .aspx tree definition:

                           <telerik:RadTreeView ID="RadTreeView1" runat="server" Style="position: relative; 
                                top: 0px; left: 0px;" AllowNodeEditing="True" BorderColor="Black" EnableDragAndDrop="True" 
                                OnNodeDrop="RadTreeView1_NodeDrop" Skin="Telerik" BorderStyle="Solid" BorderWidth="1px" 
                                MultipleSelect="True" Width="100%" OnNodeDataBound="RadTreeView1_NodeDataBound" 
                                OnClientNodeDragStart="OnClientNodeDragStartHandler" OnClientMouseOver="onMouseOver" 
                                OnClientMouseOut="onMouseOut" OnClientNodeClicked="OnClientNodeClickedHandler" 
                                OnClientNodePopulating="nodePopulating" TabIndex="1" Height="100%" OnClientKeyPressing="OnKeyPressingInTree"
                                <WebServiceSettings Path="MyWebService.asmx" Method="GetTreeViewNodes" /> 
                                <ContextMenus> 
 
... 


This is the call stack from Firebug:

tree is null 
OnKeyPressingInTree(Object _element=div#RadTreeView1.RadTreeView, Object _cancel=false _node=Object _domEvent=Object)MyScriptFile.js (line 129) 
createCallback()(Object _element=div#RadTreeView1.RadTreeView, Object _cancel=false _node=Object _domEvent=Object)Telerik....a819163f9 (line 6) 
raiseEvent()("keyPressing", Object _cancel=false _node=Object _domEvent=Object)Telerik....a819163f9 (line 745) 
_raiseCancelEvent()("keyPressing", Object _element=li.rtLI _parent=Object, Object type=keydown rawEvent=Event keydown altKey=false)Telerik....a819163f9 (line 7766) 
_onKeyDown()(Object type=keydown rawEvent=Event keydown altKey=false)Telerik....a819163f9 (line 7387) 
_onDomEvent()(Object type=keydown rawEvent=Event keydown altKey=false)Telerik....a819163f9 (line 4959) 
createCallback()()Telerik....a819163f9 (line 6) 
createCallback()(keydown charCode=0keyCode=40)Telerik....a819163f9 (line 6) 
[Break on this error] var node = tree.get_selectedNode(); 


The down arrow functionality works when I inline my scripts inside the .aspx page.

I commented out the other script errors which were reporting prior to the "tree is null" to isolate this error.

Best Regards,
Alex
0
Accepted
Vlad
Telerik team
answered on 29 Sep 2008, 03:13 PM
Hi Alex,

This line will work only if you use it on the page:
var tree = $find("<%= RadTreeView1.ClientID %>");

Kind regards,
Vlad
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Alex
Top achievements
Rank 1
answered on 29 Sep 2008, 08:03 PM
Vlad,

Yes, you are right, of course - the <% %> tags... Is there an equivalent functionality alternative I can use for that so that I could put the script in a separate file?

Thank you,
Alex
0
Vlad
Telerik team
answered on 30 Sep 2008, 06:00 AM
Hi Alex,

You can put everything else in the external script file except "tree" variable.

Kind regards,
Vlad
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Alex
Top achievements
Rank 1
answered on 30 Sep 2008, 09:55 PM
Vlad,

I found out that you don't have to use the asp.net surround tags in the external script: 

var tree = $find("RadTreeView1");

This worked for me.

Thank you for your help,
Alex
0
Axe
Top achievements
Rank 1
answered on 02 Oct 2008, 01:17 AM
Keep in mind this won't work if the control is placed inside another control using INamingContainer interface eg. MasterPage/ContentPage, WebUserControl or most composite controls such as RadGrid. If you only have the control on an .aspx page with no master page then you are safe.
0
Alex
Top achievements
Rank 1
answered on 02 Oct 2008, 01:56 AM
Thank you for pointing this out. Do you know of a work-around?
What if I give the controls unique names, i.e. containerRadGrid1, radGrid1, etc..?

Best Regards,
Alex
Tags
General Discussions
Asked by
Alex
Top achievements
Rank 1
Answers by
Vlad
Telerik team
Alex
Top achievements
Rank 1
Axe
Top achievements
Rank 1
Share this question
or