logo

Java Date-Picker Applet

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.

Image 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.

Image

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.

Image

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:

Image

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"


Image

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.....

Feedback

  1. Layout change

    Applet looks pretty nice, but being java illiterate at this point in time...anyway to easily change the date format from day/month/year to month/day/year?

    1. Re: Layout change

      Yes you can. This is built in to the applet via one of its parameters. In this article I have "hard-coded" the format as dd/mm as I am English and prefer this layout. However, notice that one of the parameters for the applet is called "datemask" and use the following formula:

      @ReplaceSubstring(@Text(@Date(2000; 12; 31); "D0S0"); "31" : "12" : "2000"; "dd" : "MM" : "yy")

      What this does is work out the date-format of the server that the applet is currently on. You can hard-code it simply by using a string instead of the above formula. i.e: "MM/dd/yy"

      HTH

      Jake -CodeStore

      Show the rest of this thread

    2. Re: Layout change

      Very nice Applet, but...... ;-)

      I've tried the layoutchange in the datamask parameter, so that I can show it in Nordic format "dd-MM-yyyy". This doesn't work!! Is the applet entirely depended on the date format on the server it is running on!!!???

      Thanks

  2. Opera Compatibility

    I have been doing some testing with Opera 5.10 and it appears that it is the Javascript that is causing the problem. I have mailed opera support who pretty much fobbed me off... :(

    From my testing it would appear that the Opera object model is not quite how the 'other' browsers handle things. If these guys are seriously interested in getting some browser marketshare then they will need to do what the other browsers do, and better.

    I don't plan on debugging their product for them. There may be a simple way to make the function jsDatePicker( szField, szDate, szAction) work in Opera, so anyone who is an Opera JS guru, feel free to post.

    Brendon.

    1. Re: Opera Compatibility

      You might try using Opera 5.11 which was released on 4/18/01, just a week after version 5.10. (We have even seen 5.10 crash web servers running SSL!)

      Show the rest of this thread

  3. datepicker applet

    That applet is good, except when I use it with IE4 the icon on the button doesn't show.

  4. Date Picker Not Working

    Hi people, I tried the Date Picker applet and did everything as mentioned in the article, but it does n't work.

    The error I get is:

    "exception:netscape.javascript.JSException: MAYSCRIPT is not enabled for this applet"

    I'm using IE 5 though. I also tried from IE4.0, but same result.

    OS=> Windows 95 Domino Server R5, Client R5

    1. Re: Date Picker Not Working

      Make sure the inside the applet tags you include the keyword MAYSCRIPT ie: <APPLET MAYSCRIPT ... >. This tells the browser's JVM to allow the applet access to the html page.

    • avatar
    • Tim Burton
    • Mon 10 Sep 2001

    An image instead of the grey square?

    Yep, very nice applet. But how do I get an image instead of the small grey square?? The square isn't very nice to the end-user...

    1. Re: An image instead of the grey square?

      This is likely your browser not wanting to get the image from the jar file. Experiment with some different browser versions.

  5. Date picker

    I had the same problem and wrote a date-picker function in JavaScript. This may avoid some of the java issues. Istead of invoking an applet, it is invoked when you click into the date field.

  6. Not Work Perfectly in IE 6.0

    Hi The problem is that when I use the IE6.0, all months start on Sunday. In another words, the first day of the month start on sunday.

    What can I do To Resolve this.

    OBS. In Netscape 6.1 it's work.

  7. not work on chinese windows

    Hi, I tried the Date Picker applet and it works properly in English Windows.

    But, when I open the page on Chinese Windows, nothing happens on click the date picker button, but the browser shows that Applet started.

    Windows=98(chin)ver2,4.10.2222A Browser=IEver5.50.4807.2300-SP2:O306121

    1. Re: not work on chinese windows

      I try it in windows2000professional(ch).The applet don't work too,why? Is it really don't working in chinese windows?

  8. Very easy to install

    Very easy to install, very usefull applet! - Fancy tackling accessing the address book in another applet?

  9. Nice unless you have multiple dates on a form

    This will work great unless you happen to have multiple date fields to fill in on a form.

    1. Re: Nice unless you have multiple dates on a form

      I have multiple date fields with the picker and it works fine.

  10. Works Great!

    This applet works fine for me. We have a legacy VB application that uses a similar control to allow users to pick a date. I am converting the application to the Intranet and need a date picker. I like java but forget all the great things that you can do with it.

    Thanks

  11. The date picker showing wrong date

    The date picker is showing wrong date information.

    The year 2001 started with "Monday" (i.e. on 01/01/2001 the day was Monday) where as u'r applet shows it was Sunday...so all the days hence forth are wrong.....

    Please correct this error.

    Regards, Rahul Bhatewara.

    • avatar
    • Thomas Thomsen
    • Wed 9 Jan 2002

    Pressing Escape

    Great applet!

    Place this piece of javascript in the JS Header to 'activate' the Esc button on your website.

    You can test it on http://www.aakc.dk/ It's in Danish, but pick a few links and press Escape!

    \\Thomas

    var key=new Array(); key['27']="x";

    function getKey(keyStroke) { isNetscape=(document.layers); eventChooser=(isNetscape)? keyStroke.which : event.keyCode; which=String.fromCharCode(eventChooser).toLowerCase();

    for (var i in key) if (eventChooser==i) { history.back(); } } document.onkeypress=getKey;

      • avatar
      • Alexander Schuth
      • Wed 9 Jan 2002

      Re: Pressing Escape, here: This is great!

      Using the Escape Button to jump back is really a great idea!

      First time I see this on the web, but it feels as natural as using the right mouse-double click in Notes to close a document. I wish all web sites would use this. Okay, yeah, you got the back button in the browser, but navigating all the way up there... And the left hand is little employed browsing the web, either, so this is fast and convenient.

      Was that your invention, or where did you find this idea?

      Show the rest of this thread

    • avatar
    • Maxrom
    • Tue 15 Jan 2002

    Date offset problem *FIX*

    After having an issue with the date offset failing on this applet (the first of the month was always a monday) I fixed it by performing another install of IE 5.5 (over a previous IE 5.5 install), selecting 'custom install' and ensuring that Microsoft Java VM is selected. It appears that the Java VM is *not* installed by default.

    Upgrading the Java VM this way fixed the issue.

    Also, as another note, specyfying a date mask with a four character year appears to break the date mask feature. For those that prefer to have M/D/Y use the following mask - MM/dd/yy

    Note : The mask is case sensitive !

    Hope this helps :)

  12. Does not work with Netscape

    It works great with Internet Explorer but does not work at all with Netscape. The netscape browser jsut freezes

  13. Instructions work only with codestore jar-file

    Be sure to use the jarfile provided by codestore (link on upper left); the jar-file from webWise Network Consultants is a higher version. When using their jar-file, the browser informs you that the CalendarWidget class cannot be found, even though the instructions on their site are apparently similar or identical to codestore's.

    1. Re: only with codestore jar-file - WRONG

      I definitely recommend you use the wnc version of the jar file. The newest version is always in improvement on the older releases.

      If you get the message 'CalendarWidget.class not found' this means you have a problem with the applet tags (codebase, archive or both) If the applet works on the wnc site, you will be downloading the EXACT SAME CODE so there is no reason it will not work on your site.

      Brendon.

    • avatar
    • BIOMIKANIKA
    • Mon 18 Feb 2002

    Netscape Lockup

    Working great in IE5/6 but locks up NN 4.7/6.2 CPU usage goes up to 100% and broswer locks up? Anyone got any work-arounds for NN?

  14. Remove text at the bottom of Date Selector

    How I can do to remove the text "Warning Applet Windows" in the bottom of Date Selector.

    • avatar
    • Matt
    • Mon 11 Mar 2002

    Datepicker & Firewall

    I've just installed this applet in my page. A friend has just imformed me that it's a waste of time using a java applet as it will most likely be blocked by the client end firewall - port 80 is often configured to block anything but http processes. Esp. because it's a Java applet and deemed a sercurity risk.

    Anyone had any probs with this?

    1. Re: Datepicker & Firewall

      The date picker applet does not iniate any comminications of its own over the network. The browser downloads the jar file off the web server as it would any file so from this perspective there will be no problems with filewalls.

      But.

      Some companys restrict the use of applets from the internet through their proxy server. This works by the proxy stripping out the <applet > tag so that it is empty (your browser then can't load the applet). This makes the applet look like a 20mm square grey box.

      Brendon.

  15. iNotes Date Picker

    Jake,

    Have you seen this from the iNotes guys?

    http://www-10.lotus.com/ldd/today.nsf/8a6d147cf55a7fd385256658007aacf1/77d60e9c1 a10909f85256b9d00593986?OpenDocument

    It's a calendar date picker using DHTML.

    • avatar
    • Pravin
    • Fri 26 Jul 2002

    Date-Picker Error

    Whenever i user this Date-Picker i can see the following two errors on server console for two different applications, can anyone suggest me to rectify this error.

    07/26/2002 11:27:44 AM HTTP Web Server: Item Not Found Exception [/purchase.nsf/a7c6ce6d1fc98b8c48256b29003a1f92/$FILE/CalendarWidgetBeanInfo.cla ss]

    07/26/2002 11:29:33 AM HTTP Web Server: Item Not Found Exception [/claims.nsf/fa74a1e4d6a55d4b48256bba00135d74/$FILE/CalendarWidget$COMClassObjec t.class

    1. Re: Date-Picker Error

      Answer [<a href="http://support.microsoft.com/default.aspx?scid=KB;EN-US;Q243771&">here</a> ]

      Jake

      Hide the rest of this thread

      1. Re: Date-Picker Error

        Anyone run into problems running the applet on a server using the RSA/ACE Domino Client? When locking down a database with the add-in, the applet won't load on the page, unlock the database and viola, the applet works. Any ideas?

        1. DHTML Popup Calendar (WAS: Re: Date-Picker Error)

          Instead of using this applet, why not use this DHTML popup calendar.

          http://students.infoiasi.ro/~mishoo/site/calendar.epl

          It is very easy to implement. The code is separate from the style and thus very very very easy to customize the look and feel.

          The problem you are having with trying to position the applet under a layer using z-index won't work. Seems that most browsers have a problem with the z-index on the following tags: applet, iframe, select. These tags are always on top no matter what you try and position on top of them. The only thing you can do is to set their visibility to hidden if you try and place something on top of them.

          In anycase, give this DHTML calendar a look.

          Jack

  16. Applet breaks with JRE 1.4

    This applet breaks when using the Sun's JRE 1.4. The "previous" and "next" buttons do not work properly, nor does the "X".

    Many of our applications require the newest JRE, thus we cannot use Microsoft's default JVM (which the date Picker works fine under).

    We were using JRE 1.3.1_02 (Date Picker works fine under this too), but Sun no longer supports it and our third-party applications are now beginning to require the JRE 1.4.

    Has anyone else come across this problem? Is there a solution?

    Regards, Jarrod Lugo

    • avatar
    • pk
    • Fri 20 Sep 2002

    Null Values and Lag Time

    Don't get me wrong, I think this little applet is great, probably only applet I would consider using, the problem I have with it is when you DON'T have a default value for a field. Clicking the applet will not pop-up a menu, which is a bit confusing from an end-user perspective. Obvious solution is to throw in a default date. Also, there seems to be some lag when paging from month to month. The iNotes DHTML calendar control provides better user interaction, however, the code is a bit messy compared to this solution.

    1. Re: Null Values and Lag Time

      Anyone know of a way to fix the lag issue that some people are having as described above or even what's causing it? We've been fighting with this for quite some time and have done everything short of formatting and reinstalling in attempt to get it working correctly.

    • avatar
    • Karen
    • Fri 15 Nov 2002

    Security question

    I love this little applet! It's great but if I set the ACL on the app I've used it in to Anonymous=No Access means the applet won't load.

    Anybody else have this experience?

    Thx, K

  17. Javascript version

    Here is a javascript version that works pretty well. I noticed some lag on the java applet in IE. I've used this javascript version without problem in IE 5.0 + and while I've not tried it in other browsers, I don't think it uses anything unusual or nitchy.

    It is long, but runs very quickly in the Javascript runtime - if there is such a thing...

    Credit to whomever the original author was... I found it in an old archive.

    jc

    getMonth_and_Date( document.forms[0], 'FIELDNAME') ; putcal( this.form, 'FIELDNAME')

    place this script in the JSHeader (R5): /globals

    var month; var day; var year;

    var delim = new Array(":","/","\\","-"," ",".");

    var monthArray = new Array(0,31,29,31,30,31,30,31,31,30,31,30,31);

    function vd(frm, fieldName,fieldLabel) {

    //init

    dtString = eval("frm." + fieldName + ".value");

    // trim date string

    while ((dtString.charAt(0) == " ") && (dtString.length != 0))

    dtString = dtString.substring(1,dtString.length - 1)

    while ((dtString.charAt(dtString.length - 1) == " ") && (dtString.length != 0))

    dtString = dtString.substring(0,dtString.length - 1)

    //get date components

    i = 0; startPos = 0; pos = 0;

    //get month

    do {

    pos = dtString.indexOf(delim[i], startPos);

    i++

    }

    while ((pos == -1) && (i < delim.length));

    if (pos == -1) return false;

    month = parseInt(dtString.substring(startPos,pos),10);

    startPos = pos + 1;

    if ((month < 1) || (month > 12)) return false;

    //get day

    i = 0;

    do {

    pos = dtString.indexOf(delim[i], startPos);

    i++

    }

    while ((pos == -1) && (i < delim.length));

    if (pos == -1)return false;

    day = parseInt(dtString.substring(startPos,pos),10);

    startPos = pos + 1;

    if ((day < 1) || (day > monthArray[month])) return false;

    //get year

    year = parseInt(dtString.substring(startPos,dtString.length),10);

    //check for leap year

    if ((month == 2) && (day == 29))

    if ((((year % 4) == 0) && ((year % 100) != 0)) == false){

    return false;

    }

    //if we've gotten this far, return true

    return true;

    } // end function vd

    function validateDate(form, dateFieldName,fieldLabel){

    if (!vd(frm,fieldName,fieldLabel))

    alert(fieldLabel + " does not have a valid date")

    }//end function validateDate

    function getToday(){

    today = new Date();

    day = today.getDate();

    month = today.getMonth();

    month++;

    year = today.getYear();

    year = (year < 100) ? 1900 + year : year;

    }

    function getMonth_and_Date(form,fieldName){

    dtString = eval("form." + fieldName + ".value");

    // trim date string

    while ((dtString.charAt(0) == " ") && (dtString.length != 0))

    dtString = dtString.substring(1,dtString.length - 1)

    while ((dtString.charAt(dtString.length - 1) == " ") && (dtString.length != 0))

    dtString = dtString.substring(0,dtString.length - 1)

    //get date components

    i = 0; startPos = 0; pos = 0;

    //get month

    do {

    pos = dtString.indexOf(delim[i], startPos);

    i++

    }

    while ((pos == -1) && (i < delim.length));

    if (pos == -1){//there's no month

    getToday();

    return;

    }

    month = parseInt(dtString.substring(startPos,pos),10) - 1;

    startPos = pos + 1;

    if ((month < 0) || (month > 12)){ //no valid month

    getToday();

    return;

    }

    else

    month++;

    //get day

    i = 0;

    do {

    pos = dtString.indexOf(delim[i], startPos);

    i++

    }

    while ((pos == -1) && (i < delim.length));

    if (pos == -1){

    getToday();

    return;

    }

    day = parseInt(dtString.substring(startPos,pos),10);

    startPos = pos + 1;

    if ((day < 1) || (day > monthArray[month])){

    getToday();

    return;

    }

    //get year

    year = parseInt(dtString.substring(startPos,dtString.length),10)

    year = (year < 100) ? 1900 + year : year;

    }//getMonth_and_Date

    function putDate(form,fieldName,value){

    eval("form." + fieldName + ".value=" + value)

    }

    function gm(num) {

    var mydate = new Date();

    mydate.setDate(1);

    mydate.setMonth(num-1);

    var datestr = "" + mydate;

    return datestr.substring(4,7);

    }

    function gy(num) {

    var mydate = new Date();

    return (1900 + eval(mydate.getYear()) - 4 + num);

    }

    function ud(mon) {

    var i = mon.selectedIndex;

    if(mon.options[i].value == "2") {

    document.myform.day.options[30] = null;

    document.myform.day.options[29] = null;

    var j = document.myform.year.selectedIndex;

    var year = eval(document.myform.year.options[j].value);

    if ( ((year%400)==0) || (((year%100)!=0) && ((year%4)==0)) ) {

    if (document.myform.day.options[28] == null) {

    document.myform.day.options[28] = new Option("29");

    document.myform.day.options[28].value = "29";

    }

    } else {

    document.myform.day.options[28] = null;

    }

    }

    if(mon.options[i].value == "1" ||

    mon.options[i].value == "3" ||

    mon.options[i].value == "5" ||

    mon.options[i].value == "7" ||

    mon.options[i].value == "8" ||

    mon.options[i].value == "10" ||

    mon.options[i].value == "12")

    {

    if (document.myform.day.options[28] == null) {

    document.myform.day.options[28] = new Option("29");

    document.myform.day.options[28].value = "29";

    }

    if (document.myform.day.options[29] == null) {

    document.myform.day.options[29] = new Option("30");

    document.myform.day.options[29].value = "30";

    }

    if (document.myform.day.options[30] == null) {

    document.myform.day.options[30] = new Option("31");

    document.myform.day.options[30].value = "31";

    }

    }

    if(mon.options[i].value == "4" ||

    mon.options[i].value == "6" ||

    mon.options[i].value == "9" ||

    mon.options[i].value == "11")

    {

    if (document.myform.day.options[28] == null) {

    document.myform.day.options[28] = new Option("29");

    document.myform.day.options[28].value = "29";

    }

    if (document.myform.day.options[29] == null) {

    document.myform.day.options[29] = new Option("30");

    document.myform.day.options[29].value = "30";

    }

    document.myform.day.options[30] = null;

    }

    if (document.myform.day.selectedIndex == -1)

    document.myform.day.selectedIndex = 0;

    }

    function showdate() {

    var i = document.myform.month.selectedIndex;

    var j = document.myform.day.selectedIndex;

    var k = document.myform.year.selectedIndex;

    alert(document.myform.month.options[i].value + "/" +

    document.myform.day.options[j].value + "/" +

    document.myform.year.options[k].value)

    }

    function putcal(form, dateFieldName) {

    var version = navigator.appVersion;

    if (navigator.appVersion.indexOf("Mac") != -1) {

    calwin = open("","calwin","width=300,height=300,resizable=yes");

    } else {

    calwin = open("","calwin","width=230,height=240,resizable=yes");

    }

    calccal(calwin,form,dateFieldName);

    }

    function calccal(targetwin,form,dateFieldName) {

    var monthname = new Array(12);

    monthname[0] = "January";

    monthname[1] = "February";

    monthname[2] = "March";

    monthname[3] = "April";

    monthname[4] = "May";

    monthname[5] = "June";

    monthname[6] = "July";

    monthname[7] = "August";

    monthname[8] = "September";

    monthname[9] = "October";

    monthname[10] = "November";

    monthname[11] = "December";

    var endday = calclastday(eval(month),eval(year));

    mystr = month + "/01/" + year;

    mydate = new Date(mystr);

    firstday = mydate.getDay();

    var cnt = 0;

    var day = new Array(6);

    for (var i=0; i<6; i++)

    day[i] = new Array(7);

    for (var r=0; r<6; r++)

    {

    for (var c=0; c<7; c++)

    {

    if ((cnt==0) && (c!=firstday))

    continue;

    cnt++;

    day[r][c] = cnt;

    if (cnt==endday)

    break;

    }

    if (cnt==endday)

    break;

    }

    targetwin.document.open() targetwin.document.writeln("<HEAD><STYLE>A:link{text-decoration:none};A:hover{co lor:red}</STYLE></HEAD>") targetwin.document.writeln("<FORM><TABLE><TR VALIGN=TOP>");

    var prevyear = eval(year) - 1;

    targetwin.document.writeln("<TD><INPUT TYPE=BUTTON NAME=prevyearbutton VALUE='<<'"+

    " onclick='opener.month = " + month + "; opener.year = " + prevyear + ";document.clear();opener.calccal(opener.calwin,opener.document." + form.name + ",\"" + dateFieldName + "\")'></TD>");

    var prevmonth = (month == 1) ? 12 : month - 1;

    var prevmonthyear = (month == 1) ? year - 1 : year;

    targetwin.document.writeln("<TD><INPUT TYPE=BUTTON NAME=prevmonthbutton VALUE='&nbsp;<&nbsp;'"+

    " onclick='opener.month = " + prevmonth + "; opener.year = " + prevmonthyear + ";document.clear();opener.calccal(opener.calwin,opener.document." + form.name + ",\"" + dateFieldName + "\")'></TD>");

    targetwin.document.writeln("<TD COLSPAN=3 ALIGN=CENTER>");

    var index = eval(month) - 1;

    targetwin.document.writeln("<B>" + monthname[index] + " " + year + "</B></TD>");

    var nextyear = eval(year) + 1;

    var nextmonth = (month == 12) ? 1 : month + 1;

    var nextmonthyear = (month == 12) ? year + 1 : year;

    targetwin.document.writeln("<TD><INPUT TYPE=BUTTON NAME=nextmonthbutton VALUE='&nbsp;>&nbsp;'"+

    " onclick='opener.month = " + nextmonth + "; opener.year = " + nextmonthyear + ";document.clear();opener.calccal(opener.calwin,opener.document." + form.name + ",\"" + dateFieldName + "\")'></TD>");

    targetwin.document.writeln("<TD><INPUT TYPE=BUTTON NAME=nextyearbutton VALUE='>>'"+

    " onclick='opener.month = " + month + "; opener.year = " + nextyear + ";document.clear();opener.calccal(opener.calwin,opener.document." + form.name + ",\"" + dateFieldName + "\")'></TD>");

    targetwin.document.writeln("</TR><TR>");

    targetwin.document.writeln("<TD>Su</TD>");

    targetwin.document.writeln("<TD>Mo</TD>");

    targetwin.document.writeln("<TD>Tu</TD>");

    targetwin.document.writeln("<TD>We</TD>");

    targetwin.document.writeln("<TD>Th</TD>");

    targetwin.document.writeln("<TD>Fr</TD>");

    targetwin.document.writeln("<TD>Sa</TD>");

    targetwin.document.writeln("</TR>");

    targetwin.document.writeln("<TR><TD COLSPAN=7><HR NOSHADE></TD></TR>");

    targetwin.document.writeln("<TR><TD COLSPAN=7><TABLE WIDTH=\"100%\" BORDER=\"0\">");

    var selectedmonth = eval(month) - 1;

    var today = new Date();

    var thisyear = today.getYear() + 1900;

    var selectedyear = eval(year) - thisyear + 4;

    var conditionalpadder = "";

    for(r=0; r<6; r++)

    {

    targetwin.document.writeln("<TR>");

    for(c=0; c<7; c++)

    {

    targetwin.document.writeln("<TD>");

    if(day[r][c] != null) {

    if (day[r][c] < 10)

    conditionalpadder = "&nbsp;"

    else

    conditionalpadder = "";

    targetwin.document.writeln("<a href=\"javascript:window.close();" +

    "opener.document." + form.name + "." + dateFieldName + ".value = '" + month + "/" + day[r][c] + "/" + year + "'" +

    "\">" + conditionalpadder + day[r][c] + conditionalpadder + "</a>")

    }

    targetwin.document.writeln("</TD>");

    }

    targetwin.document.writeln("</TR>");

    }

    targetwin.document.writeln("</TABLE></TABLE></FORM>");

    targetwin.document.close()

    }

    function calclastday(month,year) {

    if ((month==2) && ((year%4)==0))

    return 29;

    if ((month==2) && ((year%4)!=0))

    return 28;

    if ((month==1) || (month == 3) || (month == 5) || (month == 7) ||

    (month==8) || (month == 10) || (month ==12))

    return 31;

    return 30;

    }

    function calcnextmonth(month) {

    if (month=="12")

    return "1";

    else

    return (eval(month)+1);

    }

    function calcnextyear(month,year) {

    if (month=="12")

    return (eval(year)+1);

    else

    return (year);

    }

    function calcprevmonth(month) {

    if (month=="1")

    return "12";

    else

    return (eval(month)-1);

    }

    function calcprevyear(month,year) {

    if (month=="1")

    return (eval(year)-1);

    else

    return (year);

    }

  18. Have I found a bug?!

    1) Bring up calendar control and select '31/03/2003'. 2) Bring up control again and click forwards one month. Month jumps to May, not April as it should.

    I would suggest that the reason it does this is because April does not contain 31 days, thus the control has to go to to the first month that does, hence May. Further investigation yields similar problems for February, June etc...

    Has anyone fixed this?

    Tyron

      • avatar
      • Jake Howlett
      • Mon 31 Mar 2003

      Re: Have I found a bug?!

      There have been one or two bugs in the otherwise great applet. Your best bet is try the most uptodate version from the WNC site:

      http://www.wnc.net.au/wnc/website.pma/p?OpenPage&Name=datepicker

      If that doesn't work, get in touch with Brendon via the site. Sure he'd be glad to know about the bug so that he can fix it.

      Jake

      Show the rest of this thread

  19. applet exception

    I wrote a date-picker applet in jsp.But when I run the jsp,it had a error,this is the error message:

    Field=BirthDate DateMask=dd/MM/yy

    JSFunction='jsDatePicker'

    Exception occurred during event dispatching:

    netscape.javascript.JSException: Method invocation failed: 0x80020101

    at sun.plugin.javascript.ocx.JSObject.nativeInvoke(Native Method)

    at sun.plugin.javascript.ocx.JSObject.invoke(Unknown Source)

    at sun.plugin.javascript.ocx.JSObject.call(Unknown Source)

    at CalendarWidget.actionPerformed(CalendarWidget.java:132)

    at java.awt.Button.processActionEvent(Unknown Source)

    at java.awt.Button.processEvent(Unknown Source)

    at java.awt.Component.dispatchEventImpl(Unknown Source)

    at java.awt.Component.dispatchEvent(Unknown Source)

    at java.awt.EventQueue.dispatchEvent(Unknown Source)

    at java.awt.EventDispatchThread.pumpOneEventForHierarchy(Unknown Source)

    at java.awt.EventDispatchThread.pumpEventsForHierarchy(Unknown Source)

    at java.awt.EventDispatchThread.pumpEvents(Unknown Source)

    at java.awt.EventDispatchThread.run(Unknown Source)

    • avatar
    • allrooksame
    • Thu 2 Oct 2003

    Where is the time picker?

    Dates aren't good enough for my purposes.

    • avatar
    • Charlotte
    • Thu 9 Oct 2003

    Time Picker?

    How about a time picker? Can the applet be converted to do the same too? In addtion, can I allow the users to select from the picker and not type into the textbox?

    1. What do I do for users using both formats

      I have an app that is used on both sides. When the US users use it they get the mm/dd/yyyy format. When the euro's use it they get dd/mm/yyyy. It is really messing with us all. Is there a way to have it consistently use the mm/dd/yyyy format. The server is in the US but it seems to be getting formatting from the user.

      Show the rest of this thread

      • avatar
      • Charlotte
      • Mon 10 Nov 2003

      Found Time Picker

      I managed to solve this part. The applet was downloaded from another web site.

      Show the rest of this thread

  20. CSS to line up the applet with the field

    Many thanks for this article!

    The applet didn't line up very well with the field, however, so I played around with it a little. By replacing the height and width attribute with class="datepicker", you can put the following in your CSS and the applet will line up perfectly!

    applet.datepicker { height: 20px; width: 20px; vertical-align: text-bottom; }

    • avatar
    • snatcho
    • Wed 11 Feb 2004

    changing starting weekday?

    Hello to everyone. Thanks for this applet, it rocks!

    Does anybody know if it's possible to change the starting weekday so it would appear, for instance, monday in the first column and so on until sunday (that's the usual spanish format)?

    Thanks in advance, I'll understand if it's not possible.

  21. IE 6 Notes 6.0.3

    This date picker is great but......I can't seem to get it working on the web. We are currently using IE6 and Domino/Notes 6.0.3. The applet works fine in the Notes client, but on the web it doesn't. The Calendar appears as it should but when you select the date it does not change the date field on the form. Like I said it works fine in the Notes client. Any Ideas????

  22. add Picker into form Java

    Ciao, I need add your data picker into a form java; i do not use an applet. is it possible?. Can you give me the java code for add data picker? I am sorry for my English.

  23. DatePicker takes long time

    I've downloaded and tested the datepicker applet, but it seems to take an extremely long time to move from one month to the next in a linear fashion. It seems to take all the time calculating the days - first you get a blank display with the month and navigation buttons, then several seconds later the day matrix gets populated. Could this not be done very simply by just using the last day of the previous, or first day of the next month if going backwards, as the reference point instead of calculating the start day from a base date as it appears to be doing now - it would save a lot of waiting time.

  24. commercial date picker applet

    Hello

    Please check also this version of java date picker applet:

    http://www.java-date-picker.com

    1. Re: commercial date picker applet

      It doesn't have the month or year pull downs. It's just like others available on the web. Why would I pay 30 bucks for something I can get for free elsewhere?

      Show the rest of this thread

  25. DatePiker.jar in Coldfusion

    Hey guys, i had registered this applet in coldfusion administrator page, but can't make it pop-up the calendar... the current code i'm working with is this:

    <cfform name="myform"> <input type="text" name="MyDate" id="MyDate"> <cfapplet appletsource="DatePicker" name="DatePicker_Applet" form="myform" field="MyDate" title="MyTitle" DateMask="dd/mm/yyyy"> </cfform>

    This code actually shows the applet, but the pop-up is not working at all (it doesn't even shows a javascript error).

    Ne ideas?, someone who had implemented this with coldfusion?

    1. Re: not working

      Have a look through the source code again, I had the applet working in about 45 seconds, just from pasting from the HTML.

      very useful, nice one Jake...

      Glyn.

      Show the rest of this thread

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:



Navigate other articles in the category "Java"

« Previous Article Next Article »
Getting Java Applets to talk to JavaScript   Creating an Email Java Class

About This Article

Author: Jake Howlett
Category: Java
Hat Tip: webWise Network Consultants
Keywords: date; applet; format;

Attachments

DatePicker.jar (15 Kbytes)

Options

Feedback
Print Friendly

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »