0

To give you more context, my file structure look like: includes/overall/footer.php and in this file I am referencing js/nav-header.js note that both includes and js folders are in the base folder. Am I doing this correctly?

includes/overall/footer.php:

    <?php include 'includes/footer.php'; ?>

    <script type="text/javascript" src="libs/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="libs/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" scr="js/nav-header.js"></script>
  </body>
</html>

This file itself is included in another file, does it have something to do with the order in which things are being loaded perhaps? Reason being is that I cannot seem to get anything in the javascript file to fire. Any help would be appreciated.

wesley.ireland
  • 643
  • 3
  • 12
  • 21
  • what error in the console, or firebug for JS? – Muhammad Jun 26 '13 at 13:24
  • 2
    The _client_ resolves relative URLs to absolute ones, using the URL he has loaded the main document from as base. So over how many levels your include files are scattered server-side does not matter at all. – CBroe Jun 26 '13 at 13:25

3 Answers3

0

What dose you nav-header.js contain?

Assets are requested from the server in the order they appear in the html. So nav-header.js will be called after jquery however that doesn't mean it will finish loading before it.

Also to load files use absolute paths: /js/nav-header.js instead of js/nav-header.js that way you know the js/nav-header.js will be loaded from the root folder.

if u have code in js/nav-header.js that fires on load(not on document ready) i would sugest moving it to document ready.

Alex
  • 33
  • 1
  • 5
0

I recommend against using hardcoded absolute paths, as that will make the application less portable.

Instead, set a $base_url variable that you can echo in your html

<?php $base_url = "/"; ?>

In your html

<script type="text/javascript" scr="<?php echo $base_url; ?>js/nav-header.js"></script>

You can use this throughout your site for js, css, anchors, etc.

user20232359723568423357842364
  • 4,624
  • 1
  • 18
  • 28
  • That doesn't seem to do it. It can load jQuery just fine without the base url, but the javascript just won't load. I tried putting this in the .js file: $(function(){ console.log("JS loaded"); }); but it doesn't work. I put that same code in the footer.php file where I'm importing the script and it works. – wesley.ireland Jun 26 '13 at 14:22
0

Use the BASE tag in HTML with all relative paths :D

Phil Sturgeon wrote a blog post about its use in CodeIgniter, but essentially you don't need to use a framework to make use of the same principle.

You should store the document root in a variable somewhere in your application and have a function that references it, then echo that out into the base tag. This way when you move your application to a different environment you only have to change the root in one place and you are good to go.

Also, read this before using the base tag.

Community
  • 1
  • 1
Ethan
  • 2,754
  • 1
  • 21
  • 34
  • Just to reiterate, my jQuery and bootstrap files are loading fine, but I check in the chrome devtools and the js isn't even in the sources tab. – wesley.ireland Jun 26 '13 at 14:46
  • My advice, take a 15 minute break, come back to it. Odds are you are it is something simple like a path or a typo. Just give your eyes a rest. – Ethan Jun 26 '13 at 15:45