Regex to detect when certain characters or substrings - html

I'm currently using a regex to detect space, single-quote & double-quote in an input.
I would like to add the detection of several strings: ex. 'xxx' & 'yyy'. It should only detect for those complete strings, so 'x' or 'y' by itself wouldn't be detected.
Currently have this in html input code:
<input type="text" pattern="^(?=.*[\x27\x20\x22]).+$" ...

If you just want to ensure exactly one space, single-quote or double-quote appears in the input, you can simplify your pattern to:
<input type="text" pattern="[\x27\x20\x22]" ...
To detect other things, you can add "alternations", separated by |:
<input type="text" pattern="[\x27\x20\x22]|xxx|yyy" ...
As per jhnc: To detect any instance, no matter where in the string:
<input type="text" pattern=".*([\x27\x20\x22]|xxx|yyy).*" ...

Related

Preventing leading white space in input field pattern

Problem
I'm trying to prevent leading whitespace from being used in an input whether through spaces or tabs by using a pattern, but I'm having issues with this regular expression ^(?!\s)([a-zA-Z0-9 _.'"()!?&#]){1,}$, which I think is because I might not be escaping properly because of the quotation marks?
Ultimately, I want to make sure the input takes at least one character, but none of those characters be leading white space at the beginning of the query.
Invalid inputs
_This is a query
__This is a query
Valid inputs
This is a good input
abc
123
a
index.html
<form action="{% url 'master_search' %}" method="GET">
<i class="fa fa-search search-icon-drilldown" aria-hidden="true"></i>
<input type="text" class="nav__search--agency form-control inline" name="q" value="" placeholder="Search by employee name" pattern="^(?!\s)([a-zA-Z0-9 _.'"()!?&#]){1,}$" required>
</form>
Hm. If you want to allow everything that starts with a letter or number,
pattern="^[a-zA-Z1-9].*"
should do the job
You could also negate a range by doing
^[^\s]+.*$
which will match a line with a starting character that is not white space.
This is A pattern , which is uses to input type in html, but for name validation I have been analysise the pattern
pattern="^(?!\s)[a-zA-Z ]{1,}$" and I used the title (title="Request Format:Not valid numeric val & special character. Only Character") for Requested pattern form in my input type html form where type="name"

HTML phone number validation with Parenthesis

How do I validate for a pattern like this...
(562) 810-5566 or (714) 433-4434
Note that it will contain parenthesis and a space.
My current input control looks like this:
<input type="tel" data-tel-msg="Invalid Phone Number!" class="k-textbox" pattern="^\d{3}-\d{3}-\d{4}$" required />
I'm aware the current pattern matches 3334445555, but it's not what I'm looking for, when I tried adding parenthesis the JavaScript console just gave an error incorrect regex syntax.
Also as a bonus, if you know how to get it to display a custom error message that would help also. Currently my data-tel-msg is not working.
You can use the following code:
input:valid {
color: green;
}
input:invalid {
color: red;
}
<form name="form1">
<input value="(555) 324-5643" type="tel" title="Invalid Phone Number!" class="k-textbox" pattern="[(][0-9]{3}[)] [0-9]{3}-[0-9]{4}" required />
<input type="Submit"/>
</form>
The regex \(\d{3}\)\s\d{3}-\d{4} matches strings in (###) ###-#### format since the HTML5 pattern is anchored (to the start and end of string) by default.
The title attribute allows showing error text.
If the backslashes are lost in your environment, just double them, or replace \d with [0-9]. To match a literal \( you can also use a character class: [(] (same for ): [)]). Inside a character class, these ( and ) lose their "special" grouping meaning.

Form Validation Becomes Invalid After One Letter

i have a contact form where I ask for ppls names. i tried to put some validation to make sure they only used letters "[A-Za-z]". if i type in 1 letter it goes to valid but then if i type any more letters it says invalid. is there something else i need to add to "[A-Za-z]"?
<div class="form-group">
<label class="col-xs-4 control-label" for="lname">Last Name</label>
<div class="col-xs-8">
<input id="lname" name="lname" type="text" placeholder="Your last name" data-trigger="manual" data-content="Can only contain letters!" class="name form-control" type="text" required pattern="[A-Za-z]">
</div>
</div>
The meaning of your pattern value is "only one character".
for using letters you can use pattern value as pattern="[A-Za-z]+". The meaning of + is 1 or more characters.
The attribute pattern="[A-Za-z]" means that the value must be a single letter. Add the + operator to allow repetition: pattern="[A-Za-z]+". The pattern attribute values have the same syntax as regular expressions in JavaScript.
On the other hand, you probably should not use pattern at all for a person’s name, unless you have a good reason to restrict them so that people are forced to enter their names as modified (e.g. omitting diacritic marks, omitting spaces, hyphens, and apostrophes, and transcribing characters that are not in the Latin alphabet).

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.

Why is my hidden HTML form field showing up?

I'm trying to put some data in a hidden form field for a POST. But the field is showing up on my Web page. There are no styles or style sheet. Here's how the fields are defined. Any ideas?
<form action="GetUserPics.php" method="post">
<input type=”hidden” name=”picIndex” value="WHAT?">
<input type="submit" value="previous">
</form>
You are using non-standard quotation marks for your attributes on that field. HTML is interpreting those quotes as part of the attribute's value, as in:
<input type="”hidden”" name="”picIndex”" value="WHAT?">
Since ”hidden” is not a valid input type, it's reverting to text.
Because you're not using ASCII quotes, you're using some sort of weird slanty quotes that the HTML is trying to use as the type (and thus it will fall back to text). Interestingly, you're not using them to print the value, which incidentally hides your mistake.
<input type=”hidden” name=”picIndex” value="WHAT?">
Those are not regular double quotes. Try
<input type="hidden" name="picIndex" value="WHAT?">
Can you replace your hidden type input with this:
<input type="hidden" name="picIndex" value="WHAT?"/>