1

I'm trying to have a textarea which contains a list of emails validated with ng-pattern, combined with ng-list.

I've tested my Regex in various testers and it seems to work correctly but not in my application. I'm not sure if the issue is Regex, or interference between ng-pattern and ng-list.

The JSON data I'm recieving for the list is coming in array format:

$scope.mainList.EmailAddresses = ["user@emailaddress.com", "user2@altemail.net"];

My HTML code:

<textarea class="text-list-area" ng-model="mainList.EmailAddresses" ng-pattern="/^((([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6}))\n?)*$/" ng-list="&#10;" ng-trim="false"></textarea>

And the textarea separates each email by a new line like so:

user@emailaddress.com
user2@altemail.net

An example of my issue in a plunker (thanks to Beaver for creating): http://plnkr.co/edit/T17TTd5otnWWXOp2gZ94?p=preview

Community
  • 1
  • 1
enderschaos
  • 31
  • 5

1 Answers1

1

Could this jsFiddle help you?

https://jsfiddle.net/beaver71/cggLyL09/27/

I added to your code some feedback on validation errors like this:

<span ng-show="myForm.email_field.$error.pattern">Not a valid email!</span>

And a Plunker which is more effective:

http://plnkr.co/edit/T17TTd5otnWWXOp2gZ94?p=preview

In this example the textarea without your ngPattern is working well (add/remove of emails). So the problem probably is in the regEx...

beaver
  • 17,333
  • 2
  • 40
  • 66
  • Your fiddle works very nicely to get the result I need, but it made me realize I'm missing some vital information in my problem, namely my list variable is an array. Updating my question include that issue. – enderschaos Dec 10 '15 at 15:23