I am using the pattern: [s]{1}[1-9]{1,6}
I am trying to match these conditions:
It should start with s
Followed by numeric characters (with maximum 6 digits)
Blank not allowed
It's working fine at the moment, but how can I also allow a few specific values in this regex, e.g. "admin", "superAdmin"?
<input type="text" pattern="^(([s]{1}[1-9]{1,6})|admin|superAdmin)$" />
Related
I have different sign up pages that load for different countries, and I need the telephone input to be for that specific country, such as on one page it needs to be the country code 1234 followed by any 3 numbers and then any 4 numbers. so I need the pattern for the input in the html form. I am dealing with it on the server side with PHP, but I want to handle it on the client side via the input restriction pattern, as to be more efficient. Im sure its really simple but I cant seem to find a simple solution. thanks for your help
i tried the pattern restriction, i casn get the any 4 number, space, any 3 number, space any 4 numbers. but i could not get the: '1234' specific number, space, any 3 number, space, any 4 numbers.
In this example, the pattern attribute used in the input verifies that the input follows the E.164 standard. The pattern ^+(?:[0-9] ?){6,14}[0-9]$ accepts only strings beginning with + followed by 6-14 numeric characters(optionally separated by spaces) and a numeric character at the end:
<input type="tel" id="phone" name="phone" pattern="^\+(?:[0-9] ?){6,14}[0-9]$" placeholder="+391234567890" oninput="if(this.value.length==3) this.value= this.value + ' '; this.value=this.value.replace(/^(\+39[0-9]{2})([0-9]{4})([0-9]{4})$/,'$1 $2 $3')" value="+39 " minlength="14" maxlength="14" readonly onfocus="this.removeAttribute('readonly')">
The oninput attribute used to format the phone number as the user includes it, in this case to format it as +39 (XXX) XXXX XXXX (Italian prefix, my country for simplicity) In addition, the value attribute is set to +39 so that the user cannot delete the international prefix.
Im trying to make a pattern that will allow input such as SB 0023467-01 or ST 0023467-02
<input type="text" name="surat_beranak" pattern="[S]+[B\s]+[0-9]{7}+[-]+[0]+[^0-1]"
oninvalid="this.setCustomValidity('Format SB 0029384-01')"value="<?= $surat_beranak;?>"
class="form-control" placeholder="Enter Surat Beranak Number" required>
This is my current input pattern, but it's not working as intended. I need help where the pattern will allow only S as the first letter, then B or T as the second letter, then have a space after. Then there will be 7 numeric digits followed by a dash and a number, 0 then 1 or 2
You're using + between every character, which allows a character to be repeated many times. It is the equivalent of using {1,}. [0-9]{7}+ is invalid.
You're using square brackets, allowing different characters to be used in a same place. A good place to use these would be for the beginning: S[BT] would allow SB or ST. There is no need to wrap single characters with these brackets.
Your current pattern ends with [^0-1], which means "every character except 0 and 1". It goes against your goal of having "01" or "02" at the end.
Your pattern, in HTML, would be S[BT] [0-9]{7}-0[12]. If you're using this pattern anywhere else, you should wrap it between ^ and $, in order to only allow the input you want, and nothing else.
In the future, please use regex testers in order to test your pattern. Example with the working pattern and a few input examples.
Currently, I have the following input defined on an HTML page inside an Angular 9 app:
<input type="text" formControlName="amountToWithholdInput"
onkeyup="this.value = this.value.replace(/[^0-9.%$]/, '');">
As a person types, it automatically removes any character that isn't a number, a $, a % or a decimal.
How do I modify this so it will remove a % if they've already typed a $, and vice-versa (remove the $ if they've already typed a %)? In other words, it needs to check and see if a particular character exists, then remove the "opposite" character if they try to type that.
Or am I going about this all wrong? Is there some other way to do this that I haven't thought of?
Essentially you are asking your users to insert a numeric value with an optional fractional part and a trailing $ or % sign and everything else should be dropped on key input.
So, we could use a regex that matches any string but keeps the fractional numbers and a single sign in an optional group and then replace the original string only with that group $1 while the remainder in the full match gets dropped. Try it:
<input type="text" formControlName="amountToWithholdInput"
onkeyup="this.value = this.value.replace(/^((?:[0-9]+\.?[0-9]*)[%$]?)?.*/, '$1')">
To make this work we need to ensure the inner regex can also match an incomplete version of the final string, i.e. the number, dot, and sign part need to be made optional as well. If you need a more specific (e.g. only two fractional numbers) or different order (e.g. dollar sign first, percent last) we can adjust the inner regex easily but the same concept can be applied, i.e.
<input type="text" formControlName="amountToWithholdInput"
onkeyup="this.value = this.value.replace(/((?:[0-9]*\.?[0-9]{0,2}[%]?)|(?:[$]?[0-9]*\.?[0-9]{0,2}))?.*/, '$1')">
Here, the order of the sub-patterns becomes important as we want to match only one sign and only in a specific position.
So I have some forms with html input validations like so:
<input type="number" min="1" max="50" ...
Now I need to add some custom ranges such as 1-40, 45, & 50.
Previously I've just wrote javascript to handle this but would rather just use the html input validation. Is there any way to achieve this other than checking with javascript / jquery ?
I think i can use <input pattern="regularExp" ...
This could also be an option but I have no experience in it...
Thanks
In addition to min and max, HTML5 gives you the step attribute. For example, <input type="number" min="1" max="50" step="10"> gives you acceptable values of 1, 11, 21, 31, and 41. Beyond those three attributes, there is JavaScript.
If you really do not want to use JavaScript, then you can try to use a regular expression with the pattern attribute of the input element. Note that the pattern attribute requires that your input type be set to text instead of to number and include a title that is used to describe the pattern. Also note that regular expressions are meant for parsing text character by character, which makes it difficult to deal with numbers beyond a single digit.
Here's an example that allows 1-40, 45, and 50 (but not if the number is preceded by a zero):
<input type="text" name="example-number"
pattern="(^40$)|(^45$)|(^50$)|(^1[0-9]$)|(^2[0-9]$)|(^3[0-9]$)|(^[1-9]$)"
title="A number in the range of 1-40, 45, or 50">
Plenty of people recommend using code (e.g., JavaScript) instead of a regular expression for validating numeric ranges, which may be why an entire site dedicated to input patterns does not have any listed for numeric ranges.
I am using <input type=number> where I place values using Javascript. I'd like to format these numbers to have always one decimal. Chrome stubbornly strips out of trailing zero from the numbers if they have any e.g. 1.0 -> 1.
Apparently I should set pattern attribute of the control. However I am not sure what kind of values Chrome accepts here and what would be the correct pattern for formatting numbers.
pattern is used to specify a regular expression that any value the user supplies should match. Something like pattern='[0-9]+\.[0-9]' should specify 1 or more digits, a decimal, then 1 digit. You might also want to set the step size to 0.1 (step=0.1) to force only 1 decimal. I don't know if chrome will respect the pattern and size attributes or not, but that is how to specify them.