wickenex
wickenex

Reputation: 53

How to load javascript file from another directory

My idea is to create a sidebar menu through a javascript file instead of manually, which I already completed. Previously I loaded this JS file from the same directory so obviously the sidebar menu loaded just fine but now, I want to load it from a different directory and it's not just loading even if I have the source just right.

This is more or less the structure of the directories:

js - public_html - leftNav.js

Ofertas - public_html - many html files (leftNav.js previously was here aswell but I moved it)

teste - public_html - many html files (leftNav.js previously was here aswell but I moved it)

HTML file -> offers.html located in Ofertas folder

<ul class="sidebar-menu">
 <li class="header">MAIN NAVIGATION</li>
 <li class="treeview active">
  <a href="#">
   <i class="fa fa-edit"></i> <span>Projects</span>
   <i class="fa fa-angle-left pull-right"></i>
  </a>
  <ul class="treeview-menu" id="leftNav" >             
  </ul>
 </li>
 </ul>
 <script src="../../js/public_html/leftNav.js" type="text/javascript"></script>

and this is the leftNav.js file:

window.addEventListener('load', leftNav, false);

var x = location.pathname;
alert(x);

function leftNav() {

 appendUl('leftNav', 'outerUL'); 

 appendLiA('outerUL', 'offers', '/Ofertas/offers.html', 'Offers');

 appendLiA('outerUL', 'mobilecarriers', '/Ofertas/mobilecarriers.html', 'Mobile Carriers');

 appendLiA('outerUL', 'affilpixeltracking', '/Ofertas/affiliatepixel.html', 'Affiliate Pixel Tracking');

 appendLiA('outerUL', 'carrierip', '/Ofertas/carrierip.html', 'Carrier IP');

 appendLiA('outerUL', 'updtconverstats', '/Ofertas/Pag1.html', 'Update Conversion Status');

 appendLiA('outerUL', 'updtconverstats2', '/Ofertas/Pag4.html', 'Update Conversions Status - S2');

 appendLiA('outerUL', 'getconvdata', '/Ofertas/Pag2.html', 'Get Conversions Data'); 

 appendLiA('outerUL', 'getconvdata2', '/Ofertas/Pag6.html', 'Get Conversion Data - S2');

 appendLiA('outerUL', 'updtconverspr', '/Ofertas/Pag3.html', 'Update Conversions P/R'); 

 appendLiA('outerUL', 'updtconverpr2', '/Ofertas/Pag5.html', 'Update Conversions P/R - S2');

 appendLiA('outerUL', 'test', '/teste/index.html', 'Test');


function appendUl(append_to_id, ul_id) {

 var ul = document.createElement('ul');
 ul.id = ul_id;

 var appendTo = document.getElementById(append_to_id);
 appendTo.appendChild(ul);
}

function appendLiA(append_to_id, li_id, a_href, a_text, i_class) {

 var a = document.createElement('a');
 a.href = a_href;
 a.textContent = a_text;

 var li = document.createElement('li');
 li.id = li_id;
 li.appendChild(a);

 var appendTo = document.getElementById(append_to_id);
 appendTo.appendChild(li);
 }   
}    

Upvotes: 1

Views: 9910

Answers (2)

wickenex
wickenex

Reputation: 53

Turns out the problem this whole time was a slighty source innacuracy. On my HTML file I had:

<script src="../../js/public_html/leftNav.js" type="text/javascript"></script>

and supposedly I don't need to have to call public_html in the source even if the program gave the location by itself, so the correction is:

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

Upvotes: 2

ladar
ladar

Reputation: 5876

If you are using the lightweight http server that NetBeans offers for HTML5 projects, this is not possible. The server can serve only files from Site Root of the project (public_html in your case) but not from outside of site root. You will need to use your own HTTP server instead and configure your projects in NetBeans to use it (in project properties -> Run -> Web Server )

Upvotes: 0

Related Questions