I am trying to create a expression so that input string must not contain forward slash, comma or a dot.
<form name="myForm">
<div class="col-sm-4">
<input class="form-control"
type="text"
data-ng-model="model_name"
name="modelName"
ng-pattern="/^[\/,.]/" required>
<div ng-messages="myForm.$submitted && myForm.modelName.$error" role="alert">
<div class="alert alert-danger" ng-message="pattern">Special characters [/ , .] are not allowed.</div>
<div class="alert alert-danger" ng-message="required">This field is required.</div>
</div>
</div>
</form>
The regular expression /^[\/,.]/ properly matches all the characters inside the square brackets but the problem is that it is not allowing me to input normal strings such as abc or abc_def or any other strings. I don't have deep knowledge of regex and I am not getting any idea how to solve this problem. Please help.
Your regex is wrong, ^ must be inside [] in order to match all characters except /., put them in a [^/.,], in regex, when using ^ inside a block [] will match anything but what is inside the [].
When testing regex, this web it useful: http://www.regexpal.com/
Related
Field should be formatted for SSN.
9 numerical digits only + 2 dashes (XXX-XX-XXXX)
<div class="col-md-6" data-number="0" id="amdCorrSSNcont">
<label for="correctSSN">Correct SSN</label>
<input type="text" placeholder="XXX-XX-XXXX" class="form-control" id="correctSSN">
</div>
How can I format the field ?
Using RegEx is probably the best way. Make sure field max-length is correct, and use the pattern match for ###-##-####
^([0-9]{3}[-]{1}[0-9]{2}[-]{1}[0-9]{4})
A useful tool for creating Regex Patterns is https://regexr.com/
I was wondering how to add in the special character part with brackets like {} [] () and other stuff like " ' - to the unique character I tried below, but for some reason when I add in another of those characters it stops working.
<-- works but does not have any brackets or quotes for special character-->
<form acton = "#">
<input type="password" id="newPass" required
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*?[0-9])(?=.*?[!##$%^&*+`~=?\|<>/]).{8,}"
<button>submit</button>
</form>
The part above works but does not have quotes or more special character
Code below has bracket but does not work
<-- does not work (if you do not enter special character user will be able to submit but it does not have any brackets -->
<form acton = "#">
<input type="password" id="newPass" required
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*?[0-9])(?=.*?[~`!##$%^&*()-_=+[]{};:'.,"\|/?><]).{8,}"
<button>submit</button>
</form>
also this did not work (from an answer)
<form acton = "#">
<input type="password" id="pass" required
pattern="(?=.*\d)(?=.*[a-z])(?=.*?[0-9])(?=.*?[~`!##$%\^&*()\-_=+\[\]{};:\'.,\"\\|/?\>\<]).{4,}">
<button>submit</button>
</form>
I am looking for an answer that makes the bottom part (the one with brackets and all of those special character I included) works.
Since it is regex, all of the characters inside [.....] are allowed, so you should add brackets to there. You can do this with the usage of escape character (because brackets has a role in regex). So just add \] and \[ to the characters allowed inside [.....].
try:
<input type="password" name="pw" pattern="(?=.*?[#?!#$%^&*-\]\[])"
By the way.. I would recommend working with regex cheat sheet, it will help you a lot in validation tasks.
As for your EDIT:
The " and ' needed to be escaped. While \" \' won't work you can use \x27 and \x22 instead, these are the hexadecimal representation of " and ' in the ascii table.
try:
<form acton = "#">
<input type="password" id="pass" required pattern = "(?=.*\d)(?=.*
[a-z])(?=.*?[0-9])(?=.*?[~`!##$%\^&*()\-_=+[\]{};:\x27.,\x22\\|/?><]).{4,}">
<button>submit</button>
</form>
You should escape regex (e.g. \]) characters if they need to be matched during pattern search. Also, refer to the existing answer:
Braces and brackets in passwords
The following works for me, hopefully it should work at your end:
(I merely added escaped characters)
<input type="password" id="newPass" required
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*?[0-9])(?=.*?[!##$%^&*+`~'=?\|\]\[\(\)\-<>/]).{8,}">
You're actually very close. The biggest mistakes are:
You should escape some of the special characters inside the character group and you should have hyphen as the last character (otherwise it's a range).
Here is the RegExp you request:
<input type="password" id="pass" required pattern = "(?=.*\d)(?=.*[a-z])(?=.*?[0-9])(?=.*?[~`!##$%^&*()_=+\[\]{};:'.,"\\|\/?><-]).{4,}">
Update: I forgot to html encode the pattern for use directly in html. Now it should work.
I want to preserve the leading zeros for a number but as usual it trims them.
I tried
<input type="tel" pattern="[0-9]*">
But this allows text input which breaks my case.
Please help!!!
You can use the input type="text", use the ng-pattern to validate your expressions and then use ng-message to validate your field and display errors.
This won't remove your lead 0s.
So your HTML will look something like this:
<input type="text" ng-pattern="[0-9]*" ng-model="myTel">
<div ng-messages="myForm.myTel.$error">
<div ng-message="pattern">You can insert only digits here</div>
</div>
I have the following email validation code that uses the ng-pattern directive. I need to include single quotes in the error validation so that for example: asd'f#dfs.com fails. I don't want to use the default angular directive because subsequent .. (dots), ^, commas etc not catered for
<input type="email" name="username" placeholder="jasdf#asdf.com" ng-model="user.username" ng-maxlength="100" ng-model-options="{ updateOn: blur }" ng-pattern='/^(([^<>()\[\]\\.\,;:\s#"]+(\.[^<>()\[\]\\.,;^:\s#"]+)*)|(".+"))#((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/' required />
<div class="error-container" ng-show="userForm.username.$dirty && userForm.username.$error">
<small class="error" ng-show="userForm.username.$error.required">
Your email is required.
</small>
<small class="error" ng-show="userForm.username.$error.pattern">
Please input a valid email.
</small>
<small class="error" ng-show="userForm.username.$error.maxlength">
Your email cannot be longer than 100 characters
</small>
It can be seen from the above that I'm using the following Regex: ng-pattern='/^(([^<>()\[\]\\.\,;:\s#"]+(\.[^<>()\[\]\\.,;^:\s#"]+)*)|(".+"))#((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/'
My question is how do I include single quotes (') so that it doesn't clash with the ng-pattern tag quotes and also (^) in the Regex. I searched around and it seems I should use &apos but not sure how to implement. Appreciate any help.
You can use this a bit shortened version:
ng-pattern="/^(([^<>()\[\]\\.,;:\s#^\x22\x27]+(\.[^<>()\[\]\\.,;^:\s#\x22\x27]+)*)|(\x22[^#]+\x22))#((\[[0-9]{1,3}(\.[0-9]{1,3}){3}])|(([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}))$/"
Here is the regex demo
The changes are:
Three \.[0-9]{1,3} are contracted since it is repeated 3 times to (\.[0-9]{1,3}){3}
The first and second negated character classes now contain \x27 (') and \x22 (") symbols
Also added ^ to the first negated character class
\x22.+\x22 is turned to \x22[^#]+\x22 so that we do not overflow to the domain part and stay within the username part.
What I tried
^((?!root).)*$
Results
root invalid username
admin valid username
rootwee invalid username (this should be valid)
root123 invalid username (this should be valid)
I tried removing . from regex, then its not working
Can you please help with this?
Your regex features a tempered greedy token that disallows a certain substring in the whole input. Thus, "rootwee" and "root123" are invalid.
You can use
/^(?!root$)/
See demo
The anchored lookahead (?!root$) makes sure the whole input is not equal to root, but the string itself can contain root.
Note that when using a literal regex declaration, we needn't match the whole input string.
Here is a demo snippet:
function formCtrl($scope){
$scope.onSubmit = function(){
alert("form submitted");
}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="formCtrl">
<form name="myForm" ng-submit="onSubmit()">
<input type="text" name="field" ng-model="formCtrl" ng-pattern="/^(?!root$)/" required>
<span ng-show="myForm.field.$error.pattern">Not valid!</span>
<span ng-show="myForm.field.$error.required">This field is required!</span>
<input type="submit" value="submit"/>
</form>
</div>