HTML Input pattern for "currency" field - html

Attempting to use a regex pattern for an HTML input element that limits the characters to 0-9, ",","-",".","$"
I have very little experience in regex and used the pattern=[0-9,.-$] on the input element and it does not work. Though I plan on studying regex intensely in the future, I need a little help on this for now. Thank you.
<form>
<input name="currency" pattern=[0-9,.-$]>
<button>Submit</button>
</form>

don't use regex, use native type="number" that will do job for you with no need for regex
coverage is almost full > https://caniuse.com/#feat=input-number
<form>
<input type="number" name="currency">
<button>Submit</button>
</form>

You have two problems.
- indicates a range, you already used it as such for 0-9. .-$ isn't a valid range. A validator would have highlighted this for you. You need to escape the -.
You are only matching one character. You need to match multiple so use something like + to mean one or more
<form>
<input name="currency" pattern="[0-9,.\-$]+">
<button>Submit</button>
</form>

Related

Pattern attribute not working as expected?

So I'm trying to make a form for my assignment, and I am using the pattern attribute in html so only certain characters are required to be typed on the text box. But for some reason, the form is saying using that I'm using an incorrect format even though I made my pattern attribute that way.
Here's an example of the code and a picture of the problem.
<form>
<label for="mnumber">Mobile Number:</label>
<input type="text" required id="mnumber" pattern="[0-9]"><br><br>
<input type="submit" value="submit">
</form>
You did write:
pattern="[0-9]"
You are asking for only one number. You just forget to add '+' to accept more than one number. I guess what you are searching for is this:
pattern="[0-9]+"
pattern="[0-9]"
allows for only a single number character to validate (and be submitted). If you want to allow more than one character, here's your options:
One or more numbers:
pattern="[0-9]+"
Zero or more numbers:
pattern="[0-9]*"
One to three numbers:
pattern="[0-9]{1,3}"
you just need to change type="text" to type="number"

HTML form validation with the “pattern” attribute

I am trying to come up with a valid pattern for an HTML form. I would like to allow *#student.*.edu.vn
This is my code:
<input
type="text"
name="mail"
pattern="([a-z]|[0-9])+(#{1})+(student)+(.)+[a-z]+(.edu.vn)"
/>
It does not work as I would like. What I am doing wrong?
The pattern (regular expression) is slightly wrong as you haven't escaped all your special characters such as the . and have some unnecessary parts within it. Try using the following slightly modified pattern instead:
([a-z]|[0-9])+#student\.[a-z]+\.edu\.vn
<form>
<input type="text" name="mail" pattern="([a-z]|[0-9])+#student\.[a-z]+\.edu\.vn" />
<input type="submit">
</form>
Note: Make sure that you also do validation on the server-side as anyone entering values into a form can remove the pattern to bypass this check.
I came up with this solution which is slightly more easy to read and is less strict (which is a good thing because e-mail addresses can contain a lot more characters than just lowercase alpha-numeric ones. Don't forget to do proper validation on the backend using an e-mail validator.
<form>
<input
type="text"
name="mail"
pattern=".+#student\..+\.edu.vn"
/>
<input type="submit">
</form>

HTML5 pattern attribute being ignored

Just trying to make a field that only accepts 8-digit numbers and every browser lets it pass with any number of digits.
<form>
<input type="number" pattern="[0-9]{8}" required>
<input type="submit">
</form>
I feel like I'm missing something really obvious here am not seeing the problem with my pattern.
Codepen: https://codepen.io/mavelo/pen/VVZvoP
<input type="number"> elements do not support use of the pattern attribute for making entered values conform to a specific regex pattern.
Source:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number#Pattern_validation

HTML pattern regex for no spaces

What will be the correct regex pattern for an HTML input which should allow only Letters, digits and #/./+/-/_. No spaces.
You can use this regex for no space:
<form>
<input type="text" pattern="[^' ']+" />
<input type="submit" value="test submit">
</form>
So you can modify it to add your other rules
If characters order and count does not matter you can use this:
^[-a-zA-Z0-9#\.+_]+$
Scratch that, there's actually a regex for that.
<input type="text" pattern="^\S+$">
That would work for MyName, but not for My Name.

I would like to add quotes to a regex expression in an HTML tag

Here's some code:
<form>
<input type="text" name="Title" pattern="[a-zA-Z0-9`\~\!\#\#\$\%\^\&\*\(\)\-\\\\=\+\{\}\[\]\']{2,40}" required>
<input type="submit">
</form>
I would like to add quotes to the allowed in the regex expression, however \" does not work and &quot does not work, either...
So I can just replace the quotes with \x22. Now I'll have to figure out which one to use (I can instead disallow instead of allow, or use \x22 in place of the quotes). I can't remember all of the original reasons I chose to specifically allow, so I might stick with replacing it with \x22, since it's so simple and less modifying.