Member Avatar for Thirusha

Hi

I have set up an example web app which was already written by a third party company. My problem comes in when i enter the app name like http://localhost:8080/app1/ it redirects to the correct page that was used in the <welcome-file> tag in the web.xml but the js scripts and the css file does not get loaded. But when i enter the complete path to the file the scripts and css gets loaded. So i know nothing is wrong with the page, but i have no clue how to figure out what is wrong, why doesnt the scripts load??
This app does not use struts.

If any one could please point me in the right direction, i have no idea how to even google my problem.

Thanx
Thirusha

  • 2 Contributors
  • 5 Replies
  • 103 Views
  • 7 Hours Discussion Span
  • Latest Post Latest Post by Banderson
Member Avatar for Banderson

Right click on the loaded page and view source, copy and paste the header info down to the body tag here. Then tell me what is the full path to your template files if your using a template system.

When pasting please use the code tags

Member Avatar for Thirusha 
<head>
    <title>Web API</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></meta>

    <script type="text/javascript" src="../../mainapp/scripts/xxx.js"></script>

    <script type="text/javascript">

      // Construct eMap object with servlet context, and destination div for map
      //var eMap = new eMap("/mainapp/BasicMapExample", "mainMap");
      var contextRoot = '../../';

  // Create mainapp Map object
  	var eMap = new eMap(contextRoot, "mainMap");

      ESEvent.addListener(eMap, ESEvent.onInit, onMapInit);
      ESEvent.addListener(eMap, ESEvent.onClearSelection, onClearSelection);
      window.onload = function(){
        // Init eMap object with mapName
        eMap.init("Africa Map");
      }

    var layerControl = new LayerControl(eMap);
    var infoControl = new InfoControl(eMap);

      var zoomControl = new ZoomControl(eMap);

      function onMapInit(){
        zoomControl.showRQ();
        infoControl.loadRQ();
      }
    </script>

<style type="text/css">
<!--
/* BEGIN PAGE LAYOUT */
#LogoItemLeft {top:55px; left:100px; position:absolute;}

#navigationPanelHead {top:35px; font-size: 12px; font-family: verdana, helvetica, sans-serif; text-align:center; font-weight: bold; color: #FFFFFF; left:655px; width:145px; background-color:#4777A5; border: 1px solid #4777A5; z-index:100; position:absolute;}
#navigationPanel {top:50px; text-align:center; padding-top:5px; left:655px; width:145px; border: 1px solid #4777A5; z-index:100; position:absolute;}

#mapPanelHead {top:90px; font-size: 12px; font-family: verdana, helvetica, sans-serif; font-weight: bold; color: #FFFFFF; text-align:center; left:100px; width:700px; background-color:#4777A5; border: 1px solid #4777A5; z-index:100; position:absolute;}
#mainMap {top:105px; left:100px; border: 1px solid #4777A5;}
/* END PAGE LAYOUT */

/* BEGIN NAV CONTROL */

#navigationControl {position:absolute; display:block; left:125px; width:60px; top: 205px; margin-top:0px; margin-left:0px; padding:0px; border: 0px solid #FF0000; z-index:8;}
#navigationControlInner {display:block; width: 60px; height: 185px; border: 0px #00FF00 solid;}

#navigationControlSlider {position:absolute; display:block; left:145px; width:20px; top: 340px; margin-top:0px; margin-left:0px; padding:0px; border: 0px solid #FF0000; z-index:8;}
#navigationControlSliderInner {display:block; width: 20px; border: 0px #00FF00 solid;}

div.row div {float: left;}
div.col div {width:20px; text-align:center; float: left;}

div.row div.spacer {width: 20px; height: 20px;}

div.row div.panNorth {width: 20px; height: 20px;}
div.row div.panSouth {width: 20px; height: 20px;}
div.row div.panEast {width: 20px; height: 20px;}
div.row div.panWest {width: 20px; height: 20px;}

div.row div.recenterMap {width: 20px; height: 20px;}
div.row div.zoomArea {width: 20px; height: 20px;}
div.row div.dragPan {width: 20px; height: 20px;}

div.row div.zoomIn {width: 20px; height: 20px;}
div.col div.zoomRail {text-align:center;}
div.row div.zoomOut {width: 20px; height: 20px;}
div.row div.zoomExtents {width: 20px; height: 20px;}

/* END NAV CONTROL */
-->
</style>

  </head>

Not using any template system, this page is just a .htm page calling js scripts

Member Avatar for Banderson

Ok your source says that your JavaScript file is 2 directories up.

<script type="text/javascript" src="../../mainapp/scripts/xxx.js"></script>

Try changing this to 1 directory like :

<script type="text/javascript" src="../mainapp/scripts/xxx.js"></script>

and see if that works.

Member Avatar for Thirusha

Thanx, for the help, i have just changed all the references to the directory structure to the absolute values and they seem to be working, changed code to look like this

<script type="text/javascript" src="/main/mainapp/scripts/xxx.js"></script>

I think when running the file on a server and if the full path isnt displayed in the url, somehow the referenced files cannot be found. I could be wrong, although i remember a long time ago when i just started developing in html someone telling me to better use full paths and not directory structures.

Thanx again.

Member Avatar for Banderson

Well it depends on the language too. Web apps are a little more difulcult to deal with sometimes because they are mapped at load time with XML config files. If the mapping is not right in won't execute.

Glad you got it going and good luck

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.