|
Download the date-picker.zip file and extract the javascript file from it. Save it to your assets folder. Add it as a New File Asset in Publish View. Make sure it is in the same directory as the html for the page that triggers the calendar. If you are publishing Flat, it will be. If you are publishing any other way, check in Publish view and drag it to the same foider if it's not there already.
Paste this code in the Head using Layout HTML insert Between Head Tags.
<script language="JavaScript" src="date-picker.js"></script>
The tricky part is in making the form.
I did it this way. Here's my form:
I made a table of 1 row, two columns. I aligned it center. I've left the table borders showing here (so you can see the table, but on a site, I'd make table borders zero.
On the Properties palette, I selected Table is a form.
I clicked the Settings button next to the Table is a form checkbox. In the Form Name field, I typed calform. I left everything else there blank.
I inserted a Forms Edit Field (from the forms toolbar) in the left hand cell of my table.
On the Properties Palette, I changed its name to datebox
I inserted the little calendar gif in the right hand cell of the table (this gif is included in the zip file download).
I selected it and clicked the Link button.
I made a Javascript link, with this code in the entry box to the right of the New Link dropdown:
|
show_calendar('calform.datebox')
|
I clicked the HTML button on the bottom left of the Links properties palette.
On the Inside Link tab, I pasted this:
|
onmouseover="window.status='Date Picker';return true;" onmouseout="window.status='';return true;"
|
I published and tested.
Voila!
_______________________________________
This page was written, and is maintained, by Dallas
|
