Drupal 7 email fields

Sometimes the small tips are the nicest. If you own a smartphone or tablet it can be annoying to enter an email address in a regular textfield. If you fill out a form and select the email field you expect a virtual keyboard layout suited for filling in email addresses, not your default keyboard layout. The simple trick to get this field to behave is to use the correct HTML5 tag.


            
<input type="email" />

Now the default Drupal 7 Form API only supports regular text inputs. Changing existing forms is actually quite easy, albeit a bit weighty. It only required 2 steps:

  1. install and enable the elements module
  2. write a hook_form_alter() in your custom theme or module to alter the #type property of the form element. (ie, change textfield to emailfield)

Here's an example:


            
/**
* Implements hook_form_alter().
*/
function MYMODULE_form_alter(&$form, &$form_state, $form_id) {
// I don't like simplenews but it makes for a good example.
if ($form_id == 'simplenews_block_form') {
$form['mail']['#type'] = 'emailfield';
}
}

"Isn't installing the elements module just to change 1 field a bit weighty?" you might ask. Yes, it is quite a hefty solution to a very slim problem. But I believe the elements module offers a universal way forward when extending the default D7 form API. And it seems like it's pretty future proof because it is included in D8 core. So we might as well start using it now.

Submitted by Charles on Mon, 01/05/2015 - 04:45

Was searching for something to explain how the Elements module types worked for ages, thanks for this

Submitted by bas on Tue, 02/10/2015 - 07:48

You're welcome

Submitted by Anonymous on Wed, 05/20/2015 - 19:02

Wooow, thanks a lot, I spent hours to figure out how to change the input type to email. :)

Submitted by bas on Fri, 05/22/2015 - 01:43

Glad that helped you out. Thanks for leaving a note.

Submitted by Alexis on Tue, 10/13/2015 - 09:46

Thanks !

I have installed elements module and then,
it works with this code :

$form['mail']['#type'] = 'emailfield';

Submitted by bas on Wed, 10/14/2015 - 12:04

In reply to by Alexis

Oh, thanks, I see there's a small mistake in my original post. I omitted ['#type']. Cheers Alexis

Submitted by DreamingX on Wed, 01/13/2016 - 00:50

form alter should return $form...

Submitted by bas on Wed, 01/13/2016 - 23:22

In reply to by DreamingX

Passed by reference instead. Thanks for the note.

Submitted by Theolavgph on Mon, 07/13/2020 - 03:38

My coder is trying to persuade me to move to .net from PHP. I have always disliked the idea because of the costs. But he's tryiong none the less. I've been using WordPress on a variety of websites for about a year and am worried about switching to another platform. I have heard very good things about blogengine.net. Is there a way I can import all my wordpress content into it? Any kind of help would be really appreciated!

Submitted by bas on Mon, 04/26/2021 - 19:08

In reply to by Theolavgph

Sorry for the late reply mate, can't help you with blogengine.net questions.

Moving from .net to php makes sense if you can't find skilled .net coders. There tend to be more php developers available in general. If in doubt go for a larger open source platform that is well documented, like Drupal, WordPress, Joomla, Ghost or the like.

Add new comment

Plain text

This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.