I am trying to get an angular ng-pattern to check that a username has no whitespaces or special characters. The following form return false if you enter whitespaces or special characters. However, it becomes true as soon as you enter a-z, A-z or 0-9. I have tried ng-pattern="/[^\s]+/" and \S and [^ ] but they make no difference.
<form name="myform">
valid? {{ myform.$valid }}
<input type="text" name="username" ng-model="username" ng-pattern="/[a-zA-Z0-9^ ]/" required/>
</form>
Here's the form in a plunk: http://plnkr.co/edit/6T78kyUgXYfNAwB4RHKQ?p=preview
Try the following pattern:
/^[a-zA-Z0-9]*$/
This allows only alphanumeric characters.
To surface the specific answer I was looking for, I already had the pattern suggested by Sniffer /^[a-zA-Z0-9]*$/, but angular still appeared to ignore leading/trailing whitespace. As Cristian mentions in the comments:
Angular will trim the input model, meaning that the validation doesn't trigger for spaces. You can add an ng-trim="false" to the input to fix this.
Note that Angular is trying to protect you by silently trimming whitespace by default. In my case, I want the user to be aware that the trailing whitespace is invalid.
in case anyone needs to disallow user entering emails in the address field
ng-pattern="/^[^#]+$/"
<div ng-messages="vm.updateCC.mailingAddress.$error" ng-show="vm.updateCC.mailingAddress.$touched">
<p class="validation-message" ng-message="pattern">Please enter a valid address</p>
</div>
Related
I have a form as shown below in which URL field must start with http:// or https:// followed by at least one character.
<form action="/action_page.php">
Homepage: <input type="url" id="myURL" name="website" pattern="https?://.+\." title="Include http://">
<input type="submit">
</form>
Problem Statement:
I am wondering what changes I need to make in the pattern above so that user can enter any amount of character after period (\.) in the URL.
You can add .*$ to the end of your regex. This will allow the user to add zero or more characters after the dot pattern, out to the end of the string. If you'd like to prevent the user from adding more dots, you can use [^\.\s]*$ instead.
The complete regex is https?:\/\/.+\..*$ (Demo)
I have an input field in my Angular component in which i want to not allow a user to be able to type a (space).
I've tried using
<input type="text" [(ngModel)]="inputText" pattern="[a-zA-Z]">
which wasn't what i wanted, and it didn't work anyways!
Does anybody know what the correct regex pattern to just block the (space) key is? And what is the correct way to use the pattern, as the above pattern didn't work...
Thanks in advance.
Using RegEx will still allow the user to type in space. But it will mark the field as invald if a pattern validator is applied to it.
If you don't really want to allow the user to type in space in the first place, you'll have to prevent it by listening to the keydown event on the input and then handling it to prevent its default behaviour. Here, give this a try:
<input type="text" (keydown.space)="$event.preventDefault()">
Here's also a Sample StackBlitz for your ref.
If you want to allow any type of character except spaces alone without any letters, you can use this:
"^\w+( +\w+)*$"
If you also want to use accented vowels, you can use this:
"^[a-zA-Zá-úÁ-Ú0-9]+( +[a-zA-Zá-úÁ-Ú0-9]+)*$"
You can use the following pattern:
<input pattern="[^\s]*">
[^\s] is a negative set which matches every character which is not in the set.
\s matches a white space character (e.g. space, tab, etc.)
* matches 0 or more character of the preceding item
Here is an example of how the browser checks if the pattern is correct (i.e. Google Chrome for example does not allow you to submit the form if there is a whitespace character in it. Test it here (enter a string containing a white space and hit Submit):
<form>
<input pattern="[^\s]*">
<button type="submit">Submit</button>
</form>
The best way of addressing this problem is by writing the directive which you can use on multiple locations.
Here is the Stackblitz sample for the same
I am having a problem verifing the the password entered in my angular 2 form contains at least one number in it. The other validators work its just this pattern one. the regex I am using I got from
Regex: Check if string contains at least one digit
Password:
<div *ngIf="signUpForm.controls['password'].invalid && signUpForm.controls['password'].dirty">
<small *ngIf="signUpForm.controls['password'].errors.minlength">
Please enter a minimum of 6 characters
</small>
<small *ngIf="signUpForm.controls['password'].errors.maxlength">
Password cannot exceed 15 characters
</small>
<small *ngIf="signUpForm.controls['password'].errors.pattern">
Must contain digits
</small>
</div>
inside my form I have the following validator and specifically the pattern I want is to check if the string entered contains a number
"password":["", [
Validators.required,
Validators.minLength(6),
Validators.maxLength(15),
Validators.pattern('/\d')
]
]
The errors.patters ngIf never goes away even if there are numbers in the field, not sure what I am doing wrong. My other pattern validators for other fields work.
How about Validators.pattern('\\d+')?
If I understand this correctly, you would need to provide a backslash (not forward slash) to escape the backslash.
Written as a regular expression literal this would look like /\d+/, but I don't think Angular 2 supports those.
UPDATE If that's not working then it must be either something with your setup or a bug in Angular 2. I don't use Angular 2 personally so hard to say but you can see the regex itself is fine:
const regex = new RegExp('\\d+', 'g')
console.info('hiwefwe883290awefoijwfe8382jfwef'.match(regex))
Your pattern \d will only work for a single digit. You need to add a quantifier.
\d+
That will match one or more digits but not a blank value.
I am trying to allow a space in an input form field using HTML5
the code:
<input id="insightly_FirstName" name="FirstName" type="text" placeholder="characters and space only" pattern="^[A-Za-z.'-s]$" title="only Characters, spaces, and . ' - can be used" required/>
whenever I add \s and save the code Wordpress erases the "\s" sign!!
I found out the solution by adding a space inside the pattern like this :"^[A-Za-z.'- ]$"
So I have this regex intended to let pass all text but those that contain as initial chars the "34" sequence:
^(?!34)(?=([\w]+))
The regex is working fine for me in https://regex101.com/r/iN1yN3/2 , check the tests to see the intended behavior.
Any Idea why it isn't working in my form?
<form>
<input pattern="^(?!34)(?=([\w]+))" type="text">
<button type="submit">Submit!</button>
</form>
The pattern attribute has to match the entire string. Assertions check for a match, but do not count towards the total match length. Changing the second assertion to \w+ will make the pattern match the entire string.
You can also skip the implied ^, leaving you with just:
<input pattern="(?!34)\w+" type="text">