Skip to main content  
  Easy400   |       iSeries home
Public Source
About it

by Giovanni B. Perotti

(This documentation applies to the October 16, 2012 release)

Some applications may have the need to fill in input date fields by picking up values from a pop-up calendar.

You may find plenty of tools to accomplish this job through a simple Google search.

That is exactly what I did. I picked up some GNU (General Public License) code from and I wrapped it into an IBM i IFS directory named jsDatePick.
As I wanted to set up some demo, I took two of them among those available and I changed them a little to make them work with two date input fields instead of just one.
I believe that they can be useful examples for several WEB programs.

I suggest that you run

  1. first, the basic demo 1 and demo 2
  2. then, a more sophisticated demo.

If you like these demos and you want to use the same techniques for some WEB programs of yours, this is what you have to do:

  1. Download the file from the download page.
  2. Unzip the file, read the Readme memo and install the IFS directory /jsDatePick on your IBM i.
  3. Add to your HTTP instance the Apache directives documented in http_directives.txt and restart the HTTP instance.
  4. To run the basic demo from your HTTP instance, use the URI /jsDatePick/MyExample_jquery.html.
  5. To run the other demo from your HTTP instance, use the URI /jsDatePick/MyExample_jquery_full.html.
  6. In making up the HTML of your own WEB program, make sure to copy from the demo stream file the stylesheet and javascript statement outlined in the source of the demo
  7. If you selected as a model one of the basic demos(demo 1 or demo 2), you may change the date format
    from "%d-%m-%Y" to "%m-%d-%Y".
    You may also replace the separator "-" with a character of your choice, blank included.
  8. If you selected as a model the other demo, you may change the date format
    from dmy to mdy or to ymd.
    You may also change the date separator character, by specifying it in the javascript global variable datesep. If you specify a null value instead of a separator character, no date separators are shown. Examples:
    • var datesep="-"; provides dates with separator "-" instead of "/"
    • var datesep=""; provides dates with no separators.

contact us contact us