External Javascript not loading

Question

I would like to ask for help.

I have here an ASP.NET Master Page. The problem is that, the external JavaScript files do not run or even execute. I've tried placing an inline JavaScript and it works.

In adding the URL of the JavaScript files, I used the drag and drop feature of Visual Studio from Solution Explorer directly to the source code.

Inside the SiteScript.js, I have only this piece of code to test if it works.

$(document).ready(function () {
    alert("Hello World!");
});

Therefore, I would expect that upon loading the content page, the alert box shall show, but it did not.

Here's the source code of my Master Page:

<!DOCTYPE html>

<html lang ="en">

<head runat="server">

    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>PTK</title>

    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <link href="css/starter-template.css" rel="stylesheet" />

    <asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>

</head>

<body>
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="Default.aspx"><asp:Label ID="lblBrandName" runat="server" Text=""></asp:Label></a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div>

    <form id="form1" runat="server" class="form-horizontal" role="form">
         <div class="container">
            <div class="starter-template">
                <asp:ContentPlaceHolder ID="MainContent" runat="server"></asp:ContentPlaceHolder>
            </div>
        </div>
    </form>

    <script type="text/javascript" src="js/jquery-1.10.2.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/jquery-migrate-1.2.1.js"></script>
    <script type="text/javascript" src="js/SiteScript.js"></script>
</body>

I hope you could help me. Thanks in advance.

Ju-chan

Have you checked for errors in the browser console?

Pointy
– Pointy

2014-01-01 17:44:17 +00:00
Commented Jan 1, 2014 at 17:44 — Pointy
– Pointy, Commented Jan 1, 2014 at 17:44
The browser console from Firefox doesn't log anything.

Ju-chan
– Ju-chan

2014-01-01 17:45:36 +00:00
Commented Jan 1, 2014 at 17:45 — Ju-chan
– Ju-chan, Commented Jan 1, 2014 at 17:45

Alborz · Accepted Answer · 2014-01-01 17:52:56Z

1

Look at src of your js file

js/SiteScript.js

It is a relative address to your master page. Set address from root of your project to resolve the problem. If your master page is in the root folder of your web application set js address as follows

src="/js/SiteScript.js"

answered Jan 1, 2014 at 17:52

Alborz

6,9333 gold badges26 silver badges37 bronze badges

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

1 Comment

Ju-chan Over a year ago

Thanks dude, now the browser console logs all my errors in my scripts.

Collectives™ on Stack Overflow

External Javascript not loading

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related