freeform - Custom field, date format

Question

We have a need for a date input. I want to use jquery UI date picker, and I'm building a third_party plugin for freeform to use to create dates, with options for start and end dates selectable by the end user. These I'll pass to the front end no prob.

It's getting a little convoluted and It dawned on me that there might be an existing option out there? I can't be the first person ever to want to use dates in freeform... can I?

i'll carry on development, but if there are any pointers out there, I'll listen.

If I hear nothing I'll keep on developing and share my plugin later...

Cheers..

Answer 1

I might be missing the goal here (you mentioned a plugin so this might be too simple), but you can very easily add a jQuery UI Datepicker widget to any custom form field in Freeform Pro. Just create a custom text field in the Freeform Pro control panel, lets call it Start Date:

Field Type: text

Field Label: Start Date

Auto-generated Field Name: start_date

Fully generated freeform field id: freeform_start_date

Then in your form template all you need to add is the following jQuery code (assuming you have already loaded jQuery and jQuery UI JS and CSS):

<script type="text/javascript">
    $('#freeform_start_date').datepicker();
</script>

You can add all the jQuery UI bells and whistles wherever you instantiate it.

Then the relevant part of my Freeform template becomes (here I have two Datepicker widgets):

{exp:freeform:composer form_name="myform" return="success"}
<script type="text/javascript">
    // Make text fields jQuery UI Datepicker Widgets
    // Add the ability to change Month and Year with built-in jQuery UI dropdowns
    $('#freeform_start_date, #freeform_end_date').datepicker({
        changeMonth: true,
        changeYear: true
    });
</script>

I hope that helps you and future SO viewers.