How do I set the HTML5 date "min" attribute?

Question

I have a date field set up on a node in Drupal 8 using the default date time field formatter. I would like the date picker pop-up to start with a specific date I have defined in a config variable.

How can I do this? I have tried the code suggested on How to add select years and months select Drupal 8.1 date picker? but it doesn't do anything for me.

I have also looked for a way to pass datepicker options to the field element (looks like you could do that in Drupal 7 date module), but couldn't find a way to do that either.

Answer 1

In Drupal 8, the datetime fields are HTML5 inputs, so the popup is provided by the browser itself, or from a polyfill library for browsers that don't support these inputs (eg, Firefox).

If you want to provide a default value, you can do it from the settings for the field. You can use the Current Date or a Relative Date as the default. Despite the name and the docs on Relative Date, you can use this to set an actual date/time.

If you need to pull the default value from somewhere else (like config), you would hook_form_alter() the node form, and then check the field value. If it is empty, you would set the value there.

Answer 2

From mpdonadio's tip above, I actually need to set the min attribute value on the HTML 5 date value. I came across this article, which includes code to remove the seconds from the time element.

Combining those two tips, the following code works to set the min attribute on the date field:

/**
 * Implements hook_element_info_alter().
 */
function mymodule_element_info_alter(array &$types) {
    // Alter dateteime fields
  $types['datetime']['#process'][] = 'mymodule_datetime_set_startdate';
}

/**
 * Custom function to alter HTML 5 date fields.
 */
function mymodule_datetime_set_startdate($element) {
  if ($element['#parents'][0] == 'field_my_date_field') {
    // get the start date config value
    $config = \Drupal::config('mymodule.config');
    $start_date = strtotime($config->get('mymodule_start_date'));

    // For browsers using the HTML 5 date pop-up, set the min attribute value
    $element['date']['#attributes']['min'] = format_date($start_date, 'html_date');

  }
  return $element;
}

This method works better in my case than a standard form alter because there is another date field in nested paragraphs that are tricky to form alter.

The min value seems to be picked up by the fallback jQuery UI datepicker too - it works in all the browsers I've checked (including IE 11).

Answer 3

In drupal 7 You Can use date moduel(https://www.drupal.org/project/date). This module provide Date Popup Timepicker option for date field.