Link to home
Start Free TrialLog in
Avatar of OliviaRedhorse
OliviaRedhorseFlag for United States of America

asked on

JSP + Date Picker

Hello all,

I have created a form and in this form, the user will have to enter a date.  But I would like for the user to just simply select a date from a calendar and the date is entered to the input field.  Does any one have any examples or sugguestions on how to get this function on my form?  I have searched on the internet and could only find examples of calendars written in javascript.  I am working with JSP and Servlets.  I do not think javascript will work in JSP.

I would greatly appreciate your help. Thank you!
Avatar of CEHJ
CEHJ
Flag of United Kingdom of Great Britain and Northern Ireland image

>>I do not think javascript will work in JSP.

It will. JavaScript is a feature of the client browser not, the server
Avatar of Ajay-Singh
Ajay-Singh

Avatar of OliviaRedhorse

ASKER

Well, I have tried to implement this example, but I could not get it to work.

The example comes with a .js file and I tried to implement into my web application using netbeans (5.5).  The netbeans program said that the .js file is not defined. Is there another way of implementing the javascript?

Can you explain to me in more detail how this would work?  Sorry, I am new to JSP and Javascript.

Thanks
This NetBeans doc page shows how to add a .js file to your project:
http://www.netbeans.org/kb/55/vwp-ajaxprogressbar.html
Page down to "add pb.js".

If you're new to Javascript, then the interaction between Javascript and the HTML on the page can be a little tricky.  The results look very nice, though.

This is the Javascript calendar we use, and it's great:
http://www.dynarch.com/projects/calendar/
It's one of the more complicated ones, though.

mrcoffee365:
I have tried adding a .js file but the file is labeled as "Unrecognized File".  Plus, I notice that instructions relate to NetBeans Visual Web Pack 5.5.  I apologize about that, I was not specific earlier, I am working with NetBeans IDE 5.5.  Thank you for your effort though.

I have been looking for information regarding Netbeans and javascript files, but I had no luck.  I know that Netbeans IDE 5.5 has no Javascript editor, but has an update that consists of two modules that allow javascript editing on netbeans.  BUT when I attempted to download this update, I noticed that the update modules were unsigned.  This also indicated that downloading the unsigned modules would be a risk to install.

Is there a better solution to this?

How did you implement your javascript calendar?  Maybe I have the process all wrong.

You just need to put a link to the js file in your JSP. Your browser will load it. You just need to put the file on the server
You want to create a war with NetBeans, right?  Put the .js files where you want in your project directory -- web/scripts would be a good place.

Then from NetBeans, make a new folder under web, "scripts" is a good name.   There should be a way to just add files, and perhaps you can, but I used New File from NetBeans, gave it the right .js file name, then cut and paste from the original file into it.  I had to change one of the .jsp files to have NetBeans deploy a new war, but the .js file was there in the right directory at that point.

Then CEHJ is right, you just refer to the .js file in your .jsp, e.g., src="/scripts/myjs.js" .
may this link help u to some extent...
http://www.sunwesttek.com/wdp/jsp/index.html
Thank you all for your help.

I am still having problems with my javascript calendar.  I had tried several things and it still is not working.  I continue to get the error of CalendarPop.js is not defined and cal1x has no properties.  

What I did was copy my .js files in the WEB_INF directory under a new folder called js.  So when I open NetBeans, the files do show up in that directory but when I compile my jsp form and I press the "Select" link to run the javascript.  Nothing happens.

I did try to create your way, mrcoffee365, but could not create a new file by using .js extenstion.  I even tried creating a jsp file and then tried to change the name and could not.  Here is my code;

This is in the <HEAD> Section
<SCRIPT LANGUAGE="JavaScript" SRC="/WEB-INF/js/CalendarPopup.js"></SCRIPT>


This is in the body of the Section
<tr>
       <td class="label">
                <label for="lblDateRequired">Date Required: </label>
       </td>
       <td class="form">
              <input id="date1x" type="text" name="date1x">
       </td>
       <td >
       <SCRIPT LANGUAGE="JavaScript" ID="jscal1x">
                var cal1x = new CalendarPopup("testdiv1");
       </SCRIPT>
                <A HREF="#" onclick="cal1x.select(document.forms[0].date1x,'anchor1x','MM/dd/yyyy'); return false;" NAME="anchor1x" ID="anchor1x">select</A>
                                       
        </td>
</tr>
WEB-INF is a special directory -- it's like a reserved word for Tomcat.  You can't refer to it directly, so I don't think you'll ever be able to get a file with this URL:
 SRC="/WEB-INF/js/CalendarPopup.js"

You have to put your /js directory in the regular level  of application directories, so you have
/
/js
/WEB-INF
in your project directory structure.

In my testing with NetBeans, you can create a directory in your app called /js, and put your .js file there.  You can refer to that .js file in your .jsp file with src="/js/CalendarPopup.js" .  You should try adding the /js folder to your project, and the WAR from NetBeans should include it.

When you deploy the war file, then the /js directory should exist and you should be able to get to it directly once you've accessed a JSP page from the War (so that it expands):
http://yourserver/js/CalendarPopup.js
That is the test that the .js is in your server's environment.

A common problem is not referring to the .js file correctly in your <script ... src= > declaration.   Again -- check that you can get to the JSP file directly, and that the URL to get to it directly is the same as the one you are using to refer to it in your JSP file.

In my testing, I was not able to test the javascript within the NetBeans environment unless NetBeans knew about the file.  

One way to get around this, and be able to debug your code in NetBeans, is to put all of the .js files in the same directory as your JSP file, then refer to the file with a relative page, like
src="CalendarPopup.js"
That worked in NetBeans and in the deployed WAR.
Sorry, I am a little confused.

Do I create my directory such as this,
/
/js
/WEB-INF

where js folder is on the same level as WEB-INF and I put my .js files in the js folde?
Or
Do I put all of my .js files along with the JSP files, such as,
filename.jsp
filename.js
on the same directory?

Both will work, with the different effects I mentioned.

Given your confusion, it would probably be easier to put all the .js files into the same directory as the .jsp files, and refer to them in your .jsp files as relative URLs, e.g. src="CalendarPopup.js".
I moved my files to the same directory as the jsp files and still have nothing.  I get the same errors on the page.  I am just wondering, do I need to add several settings to the .js file?  I am working with the Calendar popup from this site; http://www.mattkruse.com/javascript/calendarpopup/.
ASKER CERTIFIED SOLUTION
Avatar of mrcoffee365
mrcoffee365
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I have tried your debug statement and the alert message works.  I am looking for other users of this CalendarPopup example.

Thanks
You should probably close this question, then, since we have answered it and helped with NetBeans configuration issues.

Ask your question about CalendarPopup in the Javascript forum -- more people might have used it, and you'll get better help with Javascript if you post the errors you are seeing when you try to use it.