Forums

Jason's Date Input Calendar

rgfuller 23 Mar, 2010
I found an excellent free date picker here: http://www.dynamicdrive.com/dynamicindex7/jasoncalendar.htm which I'd like to use in ChronoForms.

The setup steps (pasted below) include <script> tags, which are not allowed in the ChronoForms code editor. If anyone could help, please let me know if it looks possible to use this with ChronoForms and, if so, how to make it work.

Thanks very much.


Step 1: Insert the below into the <HEAD> section of your page:

Select All
<script type="text/javascript" src="calendarDateInput.js"> /*********************************************** * Jason's Date Input Calendar- By Jason Moon http://calendar.moonscript.com/dateinput.cfm * Script featured on and available at http://www.dynamicdrive.com * Keep this notice intact for use. ***********************************************/ </script>

The above references an external .js file. Download calendarDateInput.js (by right clicking, and selecting "Save As"), and upload to your webpage directory. It also uses 3 images, which you should download by right clicking, and selecting "Save As":

Step 2: Once the above script is added, adding a popup Calendar field to your form is a one step process. Take a look at the below example:

<form>

<script>DateInput('orderdate', true, 'DD-MON-YYYY')</script>

<input type="button" onClick="alert(this.form.orderdate.value)" value="Show date value passed">

</form>
GreyHead 24 Mar, 2010
Hi rgfuller,

You need to put the downloaded files into your site root folder (not ideal - you could move them by hacking the script file). Then use this in your form
<?php
if (!$mainframe->isSite()) {return;}
$doc =& JFactory::getDocument();
$doc->addScript(JURI::base().'calendarDateInput.js');
?>
<script>DateInput('orderdate', true, 'DD-MON-YYYY')</script>


Bob

PS Yes I know it uses script tags - sometimes you can break the rules.
rgfuller 24 Mar, 2010
Thanks - that works. Now to get it into the database...

I see many examples of how to set the value of a hidden field from php, but none that I've been able to adapt successfully here. How how could I get the date value into the db?

Also- would it be possible to make this datepicker field required in ChronoForms? The "Required" parameter in the control only determines whether the default date is displayed.

Thanks again.
GreyHead 25 Mar, 2010
Hi rgfuller,

I think that the date-picker values will be included in the info returned by the form, turn debug on to check.

Then you'll need to add corresponding columns to the database table.

Bob
rgfuller 25 Mar, 2010
yes thanks, I hadn't seen that. the debugging will make many things easier.

How about making it required on the form, since it is not a form element recognized by CF. Is that possible (easy)?

The "Required" parameter in the control only determines whether the default date is displayed.

thanks again
GreyHead 25 Mar, 2010
Hi rgfuller,

I'm not sure how you'd make it required on the front-end - it's probably possible with some neat scripting. Server-side validation would work OK though.

Bob
This topic is locked and no more replies can be posted.