Using new HTML5 elements

With the release of Drupal 8, Drupal has finally entered into the realm of HTML5. The Form API now allows utilization of HTML5 input elements out of the box. These include the following element types:

  • tel
  • email
  • number
  • date
  • url
  • search
  • range

This allows your forms in Drupal to leverage native device input methods along with native validation support.

Getting ready

This recipe will walk you through adding elements to a Drupal form. You will need to have a custom form implemented through a module, such as the one created in the Creating a form section.

How to do it…

  1. In order to use the telephone input, you need to add a new form element definition of the tel type to your buildForm method:
     $form['phone'] = array( '#type' => 'tel', '#title' ...

Get Drupal 8: Enterprise Web Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.