Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #23848

Re: Check an input field type='email' has validated successfully

Show key headers only | View raw

Thomas 'PointedEars' Lahn wrote:

> Andreas Bergmaier wrote: 
>> anthony.glazebrook@gmail.com schrieb:
>>> Is there any way to check the input field has correctly validated
>>  > without re-checking using a regular expression?
>> 
>> Yes. Just get the validity state of the input:
>> 
>>   !myInput.validity.valid
>>   // or explicitly checking for email format (in case of multiple
>>   // constraints):
>>   myInput.validity.typeMismatch
>> 
>> See
>> http://dev.w3.org/html5/spec-preview/constraints.html#the-constraint-validation-api
>> for details.
> 
> Insufficient, unfortunately.  “x@y” passes the built-in validation [1],
> but e-mails to that "address" cannot reasonably be delivered.  The
> roundtrip should be avoided by rejecting such values on the client side
> already.
> 
> Also, one must consider the possibility that the “email” value for the
> “type” attribute is unsupported.

You can use the “pattern” attribute to specify a syntax for e-mail addresses 
that is more strict [2], for example:

  <input name="email" type="email" pattern="^\s*\w@\w+\.\w+\s*$">

You can also use the mentioned Constraint Validation API with the “oninput” 
attribute (or another event-handler attribute) to validate the input while 
it is typed.  For example, it is possible to retrieve the built-in message 
that would be shown on validation, and to set a custom message.

I also note an “invalid” event that can be fired at the element without 
informing the user at first.

Presumably, this can be combined with traditional approaches for user agents 
that do not support this HTML5 feature.

> _________
> [1]
> [<http://www.w3.org/TR/2014/CR-html5-20140204/forms.html#valid-e-mail-address>

[2] <http://www.w3.org/TR/2014/CR-html5-20140204/forms.html#the-pattern-attribute>
-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | SVN: <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-matrix>
Please do not Cc: me. / Bitte keine Kopien per E-Mail.

Back to comp.lang.javascript | Previous | Next — Previous in thread | Find similar | Unroll thread

Thread

Check an input field type='email' has validated successfully anthony.glazebrook@gmail.com - 2014-04-10 10:29 -0700
  Re: Check an input field type='email' has validated successfully "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-04-10 20:24 +0200
  Re: Check an input field type='email' has validated successfully Denis McMahon <denismfmcmahon@gmail.com> - 2014-04-10 20:49 +0000
    Re: Check an input field type='email' has validated successfully Jukka Lahtinen <jtfjdehf@hotmail.com.invalid> - 2014-04-11 18:37 +0300
      Re: Check an input field type='email' has validated successfully Christoph Michael Becker <cmbecker69@arcor.de> - 2014-04-11 18:12 +0200
      Re: Check an input field type='email' has validated successfully Denis McMahon <denismfmcmahon@gmail.com> - 2014-04-11 22:51 +0000
  Re: Check an input field type='email' has validated successfully Andreas Bergmaier <andber93@web.de> - 2014-04-11 01:29 +0200
    Re: Check an input field type='email' has validated successfully "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-04-11 09:01 +0200
    Re: Check an input field type='email' has validated successfully Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-04-11 11:02 +0200
      Re: Check an input field type='email' has validated successfully Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-04-11 11:48 +0200

csiph-web