WordPress.org

Support

Support » Plugins and Hacks » Contact Form 7 » [Resolved] [Plugin: Contact Form 7] Date picker?

[Resolved] [Plugin: Contact Form 7] Date picker?

Viewing 11 replies - 1 through 11 (of 11 total)
  • I’ve added the standard jQuery datepicker by installing the appropriate jquery ui .js and .css files, adding an identifying ID to the contact form 7 form field, and calling jQuery’s datepicker(); on that ID.

    Can you give any more details?

    anyone?

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
      <script type="text/javascript" src="scripts/datePicker/date.js"></script>
      <script type="text/javascript" src="scripts/datePicker/jquery.datePicker.min-2.1.2.js"></script>
      <link rel="stylesheet" type="text/css" media="screen" href="scripts/datePicker/dates.css">

    Change the above script calls to reference the actual files (search for the date picker on google).

    Then give “datePicker” class to text fields in your form:

    [text date1 class:datePicker]

    Then use this to make the change:

    $('.datePicker').datePicker({clickInput:true})

    Good luck!

    But I wouldn’t call this issue quite resolved… I would like to use this solution as a fallback only.

    Contact form 7 should have support for <input type="date" />

    Hey thanks for that adaldesign! Just what I needed!

    For further reference, at least with the latest jQueryUI, the function should be in lower case:

    $('.datePicker').datepicker({clickInput:true})

    Thanks!

    This worked great for me. Had to make the “datepicker” lowercase as quentinio suggested.

    Thanks!

    Would you guys please explain where I should change this code?
    I can’t get it to work… feel like such a noob. 🙂

    You would put something like this in your header:

    <script type="text/javascript">
    $(document).ready(function() {
    
    	$('.datepicker').datepicker({clickInput:true})
    
    });
    </script>

    and then add:

    class:datepicker

    to the field you want the datepicker on in your contact7 form.

    I know this is somewhat of an older thread, but thought I’d share this nifty plugin for people who want to take the easy way out integrating a datepicker with cf7.

    http://wordpress.org/extend/plugins/cf7-calendar/

    Because a lot of people are looking for this I wrote a little tutorial about this:
    http://www.wordpressninja.com/2011/06/how-to-add-a-jquery-datepicker-to-your-contact-form-7/

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘[Resolved] [Plugin: Contact Form 7] Date picker?’ is closed to new replies.
Skip to toolbar