Popup Date Picker

From PikaDocs

By Andrew Cameron
Legal Services Lawline of Vermont (http://www.lawlinevt.org/) and Vermont Legal Aid (http://www.vtlegalaid.org/)


This puts a popup date picker (like on airline websites) on the time slip screen.

  • First, go download this: Tigra Calendar (http://www.softcomplex.com/products/tigra_calendar/)
  • Unzip the file
  • Put calendar2.js and calendar.html in your /js directory
  • Edit calendar.html as follows:
Find this line:
var STR_ICONPATH = 'img/';
and change it to:
var STR_ICONPATH = '/images/calendar2/';
  • Edit calendar2.js as follows:
Find this line:
'calendar.html?datetime=' + this.dt_current.valueOf()+ '&id=' + this.id,
and change it to:
'/js/calendar.html?datetime=' + this.dt_current.valueOf()+ '&id=' + this.id,
  • Copy the /img directory under your /images directory and rename it calendar2 so you have a directory /images/calendar2 with those images in it
  • Edit /subtemplates/activityT.html as follows:

Find this section:

Date Worked: <br/>
<input type=text name=act_date value="%%[act_date]%%" tabindex=1>

And immediately afterwards, add this code:

<a href="javascript:cal5.popup();">
<img src="/images/calendar2/cal.gif" width="16" height="16" border="0" 
alt="Click Here to Pick up the date"></a><br>

 Screenshot of Popup Date Picker

That should do it. I'm afraid I may have forgotten something though, so if you do this and get it to work, please either edit this page with any additional steps, or delete this note if nothing needs to be added.