How to take any character after period in input url pattern property? - regex

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)

Related

Regex match 3 characters followed by integers

I am new to regex expression and I need a regex in the following pattern:
The string must have a format of “TCK#”. TCK followed by integers.
For example, This is acceptable TCK123. This is not acceptable 123
Here is my current regex expression:
input class="form-control" required="true" type="text" name="TCKInput"
pattern="^[TCK][0-9]$">
With my current code, when the user enter TCK123, it is not acceptable, which is not what I am looking for
Change to below regex:
^(?:TCK)[0-9]+$
Demo: https://regex101.com/r/h9V7n1/1
Changes in the existing Regex you were using:
1) You were using [, ] around TCK which means regex has to match
any one of the values inside this bracket. As you have to match TCK
as it is, change it to (, )
2) You didn't mention + after [0-9] which means exactly one
occurrence will be matched. However, if you will mention +, it will
match one or more occurrence
If you want all 3 letters: TCK and then at least one or more digits after it, then try this:
^TCK\d+$
If you use [TCK] that will only accept one T, one C, or one K
Demo
This Demo sends to a live test server, so a successful submission of data will result in a response from said server
<form id='main' action='https://httpbin.org/post' method='post'>
<input class="form-control" required="true" type="text" name="TCKInput" pattern="^TCK\d+$">
<input type='submit'>
</form>

Using Multiple Patterns in Form Field

I'm attempting to create an email form field that requires a user to enter an email in the hello#domain.ext format but also only allowing business emails to come through (no gmail, yahoo, hotmail, ect.)
I've created 2 field patterns that work independently, but I can't seem to get them to work together.
Requires a hello#domain.ext format
pattern="[a-z0-9._%+-]+#[a-z0-9.-]+\.[a-z]{2,4}$"
Does not allow these free email domains. Business emails only.
pattern="^(?!.*#(?:live|gmx|yahoo|outlook|msn|icloud|facebook|aol|zoho|yandex|lycox|inbox|myway|aim|goowy|juno|(?:hot|[gy]|google|short|at|proton|hush|lycos|fast)?mail)\.\w+$).*$"
Here is my form code:
<form method="POST" action="#">
<input type=hidden name="oid" value="00D70000000KCoG">
<input type=hidden name="retURL"
value="#">
<label for="email">Email</label><input id="email" maxlength="80"
name="email" size="30" type="email"
oninvalid="setCustomValidity('Please enter your business email here.')"
onchange="try{setCustomValidity('')}catch(e){}" pattern="[a-z0-
9._%+-]+#[a-z0-9.-]+\.[a-z]{2,4}$" required />
<input type="submit" name="submit" value="Submit">
</form>
Here are the two patterns combined:
pattern="[a-z0-9._%+-]+#(?!(?:live|gmx|yahoo|outlook|msn|icloud|facebook|aol|zoho|yandex|lycox|inbox|myway|aim|goowy|juno|(?:hot|[gy]|google|short|at|proton|hush|lycos|fast)?mail)\.\w+$)[a-z0-9.-]+\.[a-z]{2,4}"
Note that the ^ at the start and $ at the end are not necessary as they are implicit there: pattern value is wrapped with ^(?: and )$ to match the entire input value.
See the regex demo.
Details
^ - implicit - start of string
[a-z0-9._%+-]+ - one or more letters, digits, ., _, %, + or -
# - a #
(?!(?:live|gmx|yahoo|outlook|msn|icloud|facebook|aol|zoho|yandex|lycox|inbox|myway|aim|goowy|juno|(?:hot|[gy]|google|short|at|proton|hush|lycos|fast)?mail)\.\w+$) - a negative lookahead the fails the match if the pattern matches immediately to the right of the current location (that is, after #)
[a-z0-9.-]+ - 1+ lowercase ASCII letters, digits, . or/and -
\. - a dot
[a-z]{2,4} - 2 to 4 lowercase ASCII letters.
NOTE: you might want to add A-Z to the character classes: [a-z0-9._%+-]+ => [\w.%+-]+ and [a-z0-9.-]+ => [a-z0-9A-Z.-]+.

I cannot add "\s" regex in my HTML code

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.'- ]$"

Regex not working in HTML5 pattern

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">

write an ng-pattern to disallow whitespaces and special characters

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>