External JS file in mastepage

10 posts, 1 answers
  1. Waleed Seada
    Waleed Seada avatar
    241 posts
    Member since:
    May 2006

    Posted 26 Dec 2009 Link to this post

    Dear All,

    I want to have en external .js file for all my functions scattered all over the page, so I created a .js file and paster everything over there.
    I went to my masterpage and add the script tag as follows: 
    <script type="text/javascript" language="javascript" src="GlobelFuncs.js"></script>
    but it doesn't work ...

    How can I accomplish that ?

    Best regards
    Waleed
  2. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 26 Dec 2009 Link to this post

    Does it contain any <%= Control.ClientID %> tags?  If so, there's your problem :)

    You could change that code to jQuery to find the elements
    var radtextbox = $telerik.$("[id$='myTextBox']");

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Waleed Seada
    Waleed Seada avatar
    241 posts
    Member since:
    May 2006

    Posted 27 Dec 2009 Link to this post

    Dear Steve,

    You are right, It has this <%= Control.ClientID%>, I did change it as your suggestion but still doesn't work, I got this error:
    PreserveState is not defined and the page doesn't load, here is how I include the .js file o my masterpage
    <head id="Head1" runat="server"
        <title>Application Name</title> 
        <script language="javascript" type="text/javascript" src="~/IScoreFuncs.js" /> 
     
    directly in the head tag after the title.
    The .js file has this function: that I change to match yours
    function PreserveState() { 
        var zone = $telerik.$("[id$='RadSlidingZone1']"); 
        //var zone = $find('<%= RadSlidingZone1.ClientID %>'); 
       var expandedPaneID = zone.get_dockedPaneId(); 
       SetCookie('dockedID', expandedPaneID); 

    .
    Could you tell what it could be...
    Regards
    Waleed
  5. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 27 Dec 2009 Link to this post

    Is jQuery loading\finding the RadSlidingZone object?

    http://www.telerik.com/help/aspnet-ajax/using-jquery.html

    var zoneid =  $telerik.$("[id$='RadSlidingZone1']").attr("id");
    alert(zoneid);
  6. Waleed Seada
    Waleed Seada avatar
    241 posts
    Member since:
    May 2006

    Posted 27 Dec 2009 Link to this post

    Hello Steve,

    The code works and display the "ctl00_RadSlidingZone1", but there is a javascript error says "Object doesn't support method".
    my RadScriptManager is like this:
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
            <Scripts> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
    I add the third line (jQueryInclude) according to the documentation.
    Then I had the following RadCodeBlock:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">  
        <script type="text/javascript">  
        // Preserve Sliding Pane dock state between pages  
        function PreserveState() {  
        var zone = $telerik.$("[id$='RadSlidingZone1']").attr("id");  
        alert(zone);  
        //var zoneid = $telerik.$("[id$='RadSlidingZone1']").attr("id");  
        var expandedPaneID = zone.get_dockedPaneId();  
        SetCookie('dockedID', expandedPaneID);  
        }  
        function OnClientLoaded(object, args) {  
        var zone = object;  
        var dockedPaneID = GetCookie('dockedID');  
        if (dockedPaneID) {  
            setTimeout(function() {  
            zone.dockPane(dockedPaneID);  
            }, 0);  
            }  
        }  
     
        function SetCookie(sName, sValue) {  
        document.cookie = sName + '=' + escape(sValue) + ';';  
            }  
     
        function GetCookie(sName) {  
        var docCookie = document.cookie;  
        if (docCookie.length > 0) {  
            var begin = docCookie.indexOf(sName + '=');  
            if (begin != -1) {  
            end = docCookie.indexOf(';', begin);  
            if (end == -1) end = docCookie.length;  
            return unescape(docCookie.substring(begin + sName.length + 1, end));  
            }  
        }  
        return null;  
        }  
    </script> 
    </telerik:RadCodeBlock> 
    with the script inside...
    The functionality of preserving the slidingZone is not working anymore ...

    Best regards
    Waleed
  7. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 27 Dec 2009 Link to this post

    Sorry, I should have mentioned that the alert on the .attr('id') was to show you're finding the object :)

    So you now should be able to use the original code, but replace the =RadSlidingZone1.ClientID with just zoneid

    So $find(zoneid);

    and it should find the item because you have it's full clientID

    Let me know,
    Steve
  8. Waleed Seada
    Waleed Seada avatar
    241 posts
    Member since:
    May 2006

    Posted 27 Dec 2009 Link to this post

    Hello Steve,

    It works, $FIND() did it's magic.

    Now , if I move this working script from codeblock to an external JS file, and include this JS file instead as follows:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">  
    <script src="IScoreFuncs.js" type="text/javascript"></script> 
    </script> 
    </telerik:RadCodeBlock> 

    I always got this "Preservestate" is not defined.

    what could be the reason !!

    Best
    Waleed
  9. Answer
    T. Tsonev
    Admin
    T. Tsonev avatar
    2770 posts

    Posted 28 Dec 2009 Link to this post

    Hello Waleed,

    As you're referencing an external file directly you can use the ScriptManager (or RadScriptManager) to include it:

    <asp:ScriptManager runat="server" ID="ScriptManager1">
        <Scripts>
            <asp:ScriptReference Path="IScoreFuncs.js" />
        </Scripts>
    </asp:ScriptManager>

    You can use Firebug's Net tab to make sure that the file is loading properly. Even a simple alert() call in the start of the file can be used as an indicator that the file is loaded.

    Happy holidays!

    Greetings,
    Tsvetomir Tsonev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  10. Waleed Seada
    Waleed Seada avatar
    241 posts
    Member since:
    May 2006

    Posted 28 Dec 2009 Link to this post

    Hello Steve,

    Thank you for helping me change the Javascript to jQuery and adding my script functions into an external JS file.

    Also I would like to thank you for this great tool FireBug.

    Best regards
    Waleed
  11. Tariq
    Tariq avatar
    1 posts
    Member since:
    Mar 2009

    Posted 12 Apr 2010 Link to this post

    Hello steve and waleed,

    Great discussion BTW, really it helped me a lot
    I have an external JS file and I followed what you said to get the control by JQuery and it's working well, but I have an issue ;I have an iframe  I want to get the RadControl from the parent page,
    here is my function i used to return a DOM object for RadControl.
    function getControl(serverId) { 
        var controlId = $telerik.$("[id$='" + serverId + "']").attr("id"); 
        if (!controlId) { 
            controlId = $telerik.$("[id$='" + serverId + "']"window.parent.document).attr("id"); 
            alert($find(controlId, window.parent.document));  // always returns null.
            return $telerik.$("#" + controlId, window.parent.document); // working but return the element not the DOM object 
        } 
        else { 
            return $find(controlId); 
        } 
    i want to get the DOM object for my RadControl at the parent page.
    please help me ASAP to get it ..
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017