ASP.Net MVC not rendering email as type="email"

Question

In my model I have:

[Required]
[DataType(DataType.EmailAddress)]
public string EmailAddress {get; set;}

However in my view (source) this renders as:

<label for="EmailAddress">EmailAddress</label>
<input data-val="true" data-val-required="The EmailAddress field is required"
    id="EmailAddress" name="EmailAddress" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="EmailAddress" data-valmsg-replace="true">

I thought this should have rendered with type="email" rather than type="text" - so when validating on the client side, it does not pickup if the email is not in a valid format.

EDIT

Further more, when I call if (ModelState.IsValid) it returns true, even if the email address is not in the correct format. so even if the browser does not support HTML5, I would have thought that the IsValid in the controller would then have enforced the validation - is that not the case?

Is there something else I need on my model, to force type="email" so this correctly checks for a valid email address?

Thanks you,

Mark

When creating your project, did you select the option for HTML5? — codingbiz
– codingbiz, Commented Apr 17, 2013 at 13:29

Community · Accepted Answer · 2017-05-23 12:08:18Z

7

The DataType attribute doesn't do any validation or render the email attribute on the input. This question describes how to add email validation using either a regular expression or the Data Annotations Extensions library.

Also if you use @Html.TextBoxFor(m => m.Email, new { type = "email" }) (if using the HTML5 doctype) that will render the email attribute which will cause validation for compatible browsers - see this.

It also has the added advantage that some (most modern) smartphones will show an email keyboard (with @ symbol and .com) for easier typing. See Default To The Numeric, Email, And URL Keyboards On The iPhone.

edited May 23, 2017 at 12:08

CommunityBot

11 silver badge

answered Apr 17, 2013 at 16:09

Ian Routledge

4,0421 gold badge26 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

sinsedrix · Accepted Answer · 2013-04-17 12:42:23Z

0

This input type is only available in HTML5:

<input type="email" />

You can try to set doctype to HTML5 for your document like this:

<!DOCTYPE html>

EDIT But you won't be sure client browser will be able to treat / validate this input as an email.

answered Apr 17, 2013 at 12:42

sinsedrix

4,8055 gold badges38 silver badges66 bronze badges

1 Comment

Mark Over a year ago

Hi - thanks - it is set to HTML5, but obviously mt browser version is not ok with HTML5 - however, when posting back to the controller, I would have expected that would have picked up on the model not being valid?

von v. · Accepted Answer · 2013-04-17 12:46:33Z

0

This maybe just what you need. On that page it says that it supports the Email input type.

There is also support for the following input types in the toolkit: Text, Color, Email, Search, Time, Tel, File, Date, Datetime, Month, Week, Range, Number

answered Apr 17, 2013 at 12:46

von v.

17.1k5 gold badges62 silver badges89 bronze badges

Collectives™ on Stack Overflow

ASP.Net MVC not rendering email as type="email"

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related