I’m moving our D7 site to Backdop, which includes our custom modules.

Having trouble with the HTML_DATETIME display of time.  

On the form I need to enable display of only the hours and minutes alongside the date, and ideally have the minutes displayed in the dropdown in increments of 5 minutes.

I can get the time to hide the seconds by adding STEP => 60 as below but concerned this is not documented (or I can’t find it) and maybe unavailable in the future.  Have used this with D9

Is there an accepted means to do this in Backdrop?

 

$form['dispatch_date_time'] = array(
  '#type' => 'html_datetime',
  '#title' => t('dispatch on'),
 # '#required' => TRUE,
 # '#default_value' => array(
  #  'date' => format_date($node->created, 'custom', DATE_FORMAT_DATE),
   # 'time' => format_date($node->created, 'custom', AADATE_FORMAT_NS),
  #),

  '#attributes' => array(
    'date' => array(
    #  'required' =>true,
      'min' => '1970-01-01',
      'max' => '2037-12-31',
      'placeholder' => t('e.g. @date', array(
        '@date' => format_date(REQUEST_TIME, 'custom', DATE_FORMAT_DATE)
      )),
    ),
    'time' => array(
     # 'required' =>true,
      # 'min' => '10:55',
      # 'max' => '13:30',
      'step' => 60, //<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    ),
  ),
  '#description' => t('Leave blank to use the current time.'),
);

 

 

 

 

Comments

I think there is some confusion about the "step" attribute. It's not provided by Backdrop, but by the "time" HTML5 input type. This is documented in many places, including here. Your code basically is doing is telling Backdrop to add the attribute "step" to the HTML input tag.

If you set the steps to 300 seconds, then you'll have a 5 minute increment.

 

 

indigoxela's picture

Hi AlanK,

the "step" attribute of the time input is an unreliable thing. Additionally you have to take care of the values you provide.

Examples:

<input type="time" step="60" value="12:10:00">

^^ will not work in all browsers, as some rely more on the value.

<input type="time" value="12:10">

^^ will probably work in most browser, but not all.

<input type="time" step="60" value="12:10">

^^ most reliable way: step + value fits step.

Step values bigger than 60 are extremely unreliable. Some browsers would follow, some don't.

And, yes, that's a native html attribute.

An alternative to using the html_datetime form API element is to use date_popup. It doesn't use HTML5, but jQuery datepicker and timeentry.

Unfortunately this element is not documented in Backdrop Form API. But you can figure it out by looking at how date fields define their widgets when using date_popup (e.g. by doing a form_alter and outputting the form array).

Typically something like this will allow you to do 5 minute intervals reliably. The time entry is NOT done as a select list, but rather as direct input, but the widget prevents you from picking minutes that don't fall in the 5 minute interval

 

  $form['my_date'] = array(
    '#type' => 'date_popup',
    '#title' => t('Date 1'),
    '#description' => t('Date of the event.'),
    '#required' => TRUE,
    '#default_value' => time(),
    '#date_format' => 'm/d/Y g:ia',
    '#date_increment' => 5,
  );