How to use an external javascript file in asp.net

Question

I wrote a script to hide and show a loader for my asp.net web application. The script works great when placed inline. I tried to extract the script to an external file and received the following error:

Error: The value of the property 'Pausing' is null or undefined, not a Function object

I tried to look up the error, but I was unable to find a solution to the problem. I am new to asp.net so it may be that I'm not sure how to search for the right question.

My inline code that works is:

<script type="text/javascript">

    function Pausing() {
        window.setTimeout(ShowLoader, 1);
    }

    function ShowLoader() {
        if ((typeof Page_IsValid === 'undefined') || 
            (Page_IsValid != null && Page_IsValid)) {
            var i = document.getElementById("loader");
            var img = document.getElementById("img");
            i.style.display = "block";
            setTimeout("document.images['img'].src=document.images['img'].src", 10);
            Endpausing();
        }
    }

    function HideLoader() {
        var i = document.getElementById("loader");
        i.style.display = "none";
    }

    function Endpausing() {
        window.setTimeout(HideLoader, 4000);
    }
</script>

The event call is attached to an asp:button control below:

<asp:Button ID="btnGetReport" runat="server" OnClick="btnGetReport_Click" OnClientClick="Pausing();" />

I removed the inline script and replaced with this...

<script type="text/javascript" src="../../Scripts/Loader.js"></script>

Added script to external file:

window.onload = initAll;

function initAll() {

    function Pausing() {
        window.setTimeout(ShowLoader, 1);
    }

    function ShowLoader() {
        if ((typeof Page_IsValid === 'undefined') ||      // asp page has no validator
                (Page_IsValid != null && Page_IsValid)) {
            var i = document.getElementById("loader");
            var img = document.getElementById("img");
            i.style.display = "block";
            setTimeout("document.images['img'].src=document.images['img'].src", 10);
            Endpausing();
        }
    }

    function HideLoader() {
        var i = document.getElementById("loader");
        i.style.display = "none";
    }

    function Endpausing() {
        window.setTimeout(HideLoader, 4000);
    }
}

Then I receive the previously mentioned error.

Any help would be greatly appreciated!

make your inline code the same as the external file, and see if you get the same error. Go from there with your debugging. — CM Kanode
– CM Kanode, Commented Jul 2, 2012 at 16:09

Suave Nti · Accepted Answer · 2012-07-02 16:19:32Z

5

Always use ResolveUrl to call your script files like this

Lets assume your script is in Script folder of your root path with a file Name as MyScriptFile.js

 <script type="text/javascript" src="<%= ResolveUrl ("~/Scripts/MyScriptFile.js") %>"></script>

EDIT : you can use ResolveUrl or ResolveClientUrl based on your needs

ResolveUrl creates the URL relative to the root where as ResolveClientUrl creates the URL relative to the current page.

edited Jul 2, 2012 at 16:19

answered Jul 2, 2012 at 16:14

Suave Nti

3,76713 gold badges57 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

jfielaidof Over a year ago

I added this into my script src attribute and I am still receiving the same error. Any thoughts?

Suave Nti Over a year ago

Have you tried with ResolveClientUrl instead of ResolveUrl as well ?

Suave Nti Over a year ago

Just checked why do you using initAll i.e.., initAll() function? put the pausing function out of it intiAll()

jfielaidof Over a year ago

I just tried ResolveClientUrl and removing initAll() function with every combination. Still a no joy!

Suave Nti Over a year ago

First I advice you to create another js file external with a test function and alert inside it and try checking if you can see the alert.

|

HatSoft · Accepted Answer · 2012-07-02 16:07:24Z

0

Based on your question : How to use an external javascript file in asp.net

<script type="text/javascript" src="http://www.xyz.com/test.js"></script>

answered Jul 2, 2012 at 16:07

HatSoft

11.3k3 gold badges30 silver badges43 bronze badges

Collectives™ on Stack Overflow

How to use an external javascript file in asp.net

2 Answers 2

7 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related