Java Date-Picker Applet

Jake Howlett, 9 April 2001

Category: Java; Keywords: date applet format

Entering dates on forms via the web. For something that should be so simple this is, more often than not, a troublesome area. It would probably be a whole lot easier if the whole world stuck to using the same format but then wouldn't that make it boring!?

There are all sorts of weird and wonderful solutions to picking dates available for you to download on the web. Some are easy to use, some aren't. Some are fool-proof, some aren't. In any case the best thing for the user is probably to give them something they are used to and that is as simple as possible. In the case of Notes this would be the date-picker widget as shown in the screen-shot below.

Surprisingly, for an in-built feature of Notes, this is quite easy to use and intuitive.

However, this isn't one of the widgets that Iris have deemed important enough to convert in to a "web-feature" as of yet. No need to wait for them though as Brendon Upson of webWise Network Consultants has beaten them to it with his own Date-Picker Java Applet.

Take a look at the "date" field below. Notice the small grey square next to it. This is the applet. Click on it to bring up the calendar and choose a date. The applet then calls a simple JavaScript function to update the value in the field.

Date of Birth:

How to add the applet to your forms

First thing to do is download the applet to your machine. There is a link in the table over there on the left somewhere to DatePicker.jar. Put it somewhere you are going to remember ;-)

In the form, next to your date field, insert the applet using the "Java Applet.." option under the Create menu.

Click on the folder icon to browse to the .jar file you downloaded. Note that you will need to change the Files of Type from .class to .jar first.

This should place the applet on your form. We now need to alter some of its properties to get it to function properly. First thing to do is change the Base Class to CalendarWidget.class (Notes will have assumed it was DatePicker.class). We also need to change its dimensions to 20x20. You can do both of these changes in the applet's property box, as below:

Almost there! Just need to add some parameters and some JavaScript....

With the applet selected add the text "MAYSCRIPT" to its HTML Attributes and the following to its Parameters in this order:

Parameter	Value
field	"BirthDate" (in this case)
datemask	@ReplaceSubstring(@Text(@Date(2000; 12; 31); "D0S0"); "31" : "12" : "2000"; "dd" : "MM" : "yy")
title	"Date of Birth"

All you need to do now is add the following JavaScript function to the JS Header of the form. This is what the applet uses to interact with the page.

function jsDatePicker( szField, szDate, szAction){

 var form = document.forms[0];

 var field = form.elements[szField];

 if(szAction == "1"){

  field.value=szDate;

 }

 return field.value;

}

Note: This function wouldn't be necesary if the applet were signed as that would give it full access to the page. The drawback is that signing the applet would mean that you had to accept its signature when it loaded. Hence the author wisely decided not to.

So, there you have it. Your very own date picker for the web. Now you can reminisce of days gone by pretending you still use the Notes client and pressing escape to try and close the browser ;-) or is that just me....

Note: As with all Java applets - use with caution. They are by no means foolproof. In the words of this applets author: Java = write once, debug everywhere.

I have it on good authority (the author told me) that this applet is tried and tested in IE4/5/5.5 and NN4+ (although a bug in the 4.6 JVM stops it working properly).

I tried it in Opera 5 and it crashed the browser.....