Disable Email Authentication

Question

I have the following html / angular snippet

<input type="email" data-ng-model="myEmailVar" /> {{ myEmailVar }} 

Now the angular issue has an auto-validator for emails that won’t install myEmailVar if it fails correctly. So, for example, if I enter "name", myEmailVar will not be installed. You can see it here: http://jsfiddle.net/bFVsW/ (enter the word test, then enter [e-mail] )

Now I want to run my own validation, but also support mobile. If I use type = "email", some mobile browsers switch the keyboard layout to make typing the address easier (like the @ symbol). Therefore, I cannot switch it to type = "text". What I would like to do is override the angular email validator or just completely disable it, as I will handle my own validation. Is it possible?

Answer 1

In HTML5, you can use the novalidate form attribute to disable browser validation:

 <form novalidate> <input type="email"/> </form> 

Or you can use type="text"

Answer 2

For any body that is still looking for an answer, I found the answer in this answer overflow: How do I turn off corner type = email check?

Essentially, you can add your own custom directive that disables the default angular validators.

 angular.module('app').directive('disableValidators', function() { return { require: 'ngModel', link: function(scope, elm, attrs, ctrl){ var validator = function(value){ return value; }; // replace other validators with our own ctrl.$parsers = [validator]; ctrl.$formatters = [validator]; } } }); 

Another answer in the same thread contains a more detailed answer: How to disable the type of corners = checking email?

Edit: this solution worked for me in the past, but no longer worked when upgrading from angular 1.2.X to 1.3.X. It works, however, with a few minor changes:

 angular.module('app').directive('disableValidators', function() { return { require: 'ngModel', link: function(scope, elm, attrs, ctrl) { var validator = function(value) { return value; }; // replace the email validators ctrl.$validators = {email: validator}; } } }); 

Answer 3

UPDATE: This does NOT work ... well, at least not in the way you would like. Adding ng-non-bindable to the form or any ALL binding input interrupts. Thus, your ng model on inputs will no longer work. Excuse me....

ng-non-bindable is the answer to this problem. See my answer here:

fooobar.com/questions/600337 / ...

Answer 4

A simple solution: init field with type 'text' and change the type to 'email' for timeout. In this case, angularjs will not add email authentication, and you will have an email keyboard.

 <input type="{{type}}" /> $scope.type = 'text'; $timeout(function() { $scope.type = 'email'; }); 

http://jsfiddle.net/44pc5j8L/