Referencing Javascript libraries with Tomcat

Question

I am using Eclipse Ganymede and Tomcat 5.5. I would like to add some javascript and especially ajax functionality to a dynamic web project and need some help.

I would like to use jquery (but I am open to other suggestions, if you tell me why another library would be better in this case, but I have chosen jquery because it is supposed to be simple (which on the first look it seems to be)).

I am having two problems:

1- Tomcat can't find the jquery library. I tried several things in my jsp file like:

   <script type="text/javascript" src="WEB-INF/lib/jquery-1.3.2.min.js"></script>
   <script type="text/javascript" src="/WEB-INF/lib/jquery-1.3.2.min.js"></script>
   <script type="text/javascript" src="./WEB-INF/lib/jquery-1.3.2.min.js"></script>

As you can see, I threw the jquery library in /WEB-INF/lib. Executing the jsp file within a browser without tomcat (with the last path version) works, so the path is correct.

2- There is no proper syntax highlighting within the dynamic web project for jquery and no popup suggestions. I also tried the information in this article, but it didn't change much.

Answer 1

To be more specific (because it took me about half an hour to figure this out after getting to this point):

When you create a Dynamic Web Project with Tomcat in Eclipse, among other things in the project you get a folder named "WebContent". That's the actual folder that gets deployed to the Tomcat server, in Eclipse's equivalent of Tomcat/webapps/<project name> (I'm not sure where it really exists). For security reasons, as a special case nobody can access the META-INF and WEB-INF folders in there, so putting your scripts in those places will not help.

What you have to do is create a folder inside of WebContent, and stick your Javascript in there. This folder will be globally visible, so visitors to your site (like you, when you test it) can actually get to the Javascript.

What I did, for instance, was create a folder named "script" in WebContent and put my Javascript in there; then, when I needed to reference it in a page, I put in src="ProjectName/script/AwesomesauceJavascript.js"

Answer 2

I'd like to add to what @Tacroy responded with. Within the server you're using in Eclipse, check the server.xml. Make sure:

Context docBase="SomeProjectName" path="/SomeProjectName" <-- path and docBase attributes need to be the same.

I had two different things there, and had to make them identical for the src attribute to work in the jsp.

Answer 3

First you must to add resource mapping to your folder where you put jquery.js script library. That folder must be public.

To make folder public use this line of code:

<resources mapping="/scripts/**" location="/WEB-INF/scripts/**" />

Now you just need to add reference in your page to this path:

<script type="text/javascript" src="scripts/jquery-1.10.2.js" ></script>

Answer 4

Below are the steps to enable jQuery syntax highlighting and content assist highlighting in Eclipse.

1. Download jqueryWTP0.40foEn.jar.

2. Find your Eclipse Plugin org.eclipse.wst.jsdt.core_version.jar, backup the plugin. (e.g. C:\DEV\EclipseIndigo37\eclipse\plugins \org.eclipse.wst.jsdt.core_1.1.100.v201104272153.jar)

3. Double click the JAR file or run with command java -jar jqueryWTP0.40foEn.jar.

4. On the opened swing UI, choose org.eclipse.wst.jsdt.core_version.jar, and output directory.

5. Click the generate button.

6. Replace the old org.eclipse.wst.jsdt.core_version.jar file with the generated file.

7. Delete the directory workspace/.metadata/.plugins/org.eclipse.wst.jsdt.core

8. Start Eclipse.

9. Open a HTML file or a JavaScript file, edit JavaScript content.

jQuery content assist is now available.
Plugin Developer & Source