In date_popup's README.txt, it states that

The time selector will add AM/PM if 'a' is in the format string.

Which leads me to believe that

'#default_value' => date("m/d/Y H:ia"),
'#date_format' => 'm/d/Y H:ia',

should result in a textfield for the time picker that looks like:


but instead I just get a blank text field. I can't get any combination of default_value / date_format to result in what I'm looking for. Am I reading the documentation wrong, or can this be achieved?

Update: I couldn't get this darn thing working and decided to disable the timepicker (admin/config/date/date_popup) and added the timepicker from http://jonthornton.github.com/jquery-timepicker/ using the following code:

  $form['#attached']['css'][] = 'path/to/jquery-timepicker/jquery.timepicker.css';
  $form['#attached']['js'][] = '//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js';
  $form['#attached']['js'][] = array('data' => "var jq9 = jQuery.noConflict();", 'type' => 'inline');
  $form['#attached']['js'][] = 'path/to/jquery-timepicker/jquery.timepicker.js';
  $form['#attached']['js'][] = array(
    'data' => "
      jq9(document).ready(function() {
    'type' => 'inline',
  $form['start_date'] = array(
    '#title' => 'Start Date',
    '#type' => 'date_popup',
    '#required' => TRUE,
    '#date_type' => DATE_DATETIME,
    '#date_timezone' => date_default_timezone(),
    '#default_value' => date("m/d/Y h:ia"),
    '#date_format' => 'm/d/Y h:ia',
    '#date_increment' => 1,
    '#date_year_range' => '-1:+1',

1 Answer 1


I remember having a similar issue - I fixed it using a custom module like this, the possible cause was probably that Drupal and jQuery returned different formats...

$GLOBALS['locale'] = $locale = 'fr';

/* [...] */

function x_form_alter(&$form, &$form_state, $form_id){
    // Fix date format in some exposed date filters (cck date)
    $date_format = 'd/m/Y'; /* Should be same as in "sites/all/js/jquery.datepicker/$locale.js" */
    foreach($form as $key => $value){
        isset($value['value']['#date_format']) && $form[$key]['value']['#date_format'] = $date_format;
        isset($value['min']['#date_format']) && $form[$key]['min']['#date_format'] = $date_format;
        isset($value['max']['#date_format']) && $form[$key]['max']['#date_format'] = $date_format;

I guess you can adapt this code to your situation and even better, suggest a cleaner solution.

  • Thanks. I couldn't get this working and ended up replacing the default timepicker. Updated my question with that info for others. Jan 22, 2013 at 16:41
  • You may be interested in the jQuery plugin timepicker - Preview: s1.postimage.org/k5o2gue8v/datetimepicker.png Jan 22, 2013 at 17:42
  • I actually saw that when trying to find an alternate plugin, but I don't find using a slider to pick a time very helpful. Jan 22, 2013 at 17:46
  • I read you comment but I insist - That plugin is highly customizable, the slider can be modified to suit your need (eg. move by steps of 10 minutes). Another less usable solution would be haineault.com/media/jquery/ui-timepickr/page Jan 22, 2013 at 17:50
  • I've used the second one you listed – that's a good one. Ultimately, I am finding the one I linked to in my question to be the fastest, "most expected" interface for the users that have to use this. Jan 22, 2013 at 19:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.