Are apostrophes valid containers for HTML element attribute values? - html

Usually HTML element attribute values are marked with a quotation mark, like
<input type="hidden" value="test" />
Sometimes, however, you see code like
<input type='hidden' value='test' />
Is it valid HTML and can it cause any problems? What about mixing the two, like
<input type='hidden' value="test">
?

The linked question from James Allardice's comment to my original question lead me to the answer: yes, apostrophes are valid containers for HTML element attribute values.
Specification: On SGML and HTML
By default, SGML requires that all attribute values be delimited using either double quotation marks (ASCII decimal 34) or single quotation marks (ASCII decimal 39). Single quote marks can be included within the attribute value when the value is delimited by double quote marks, and vice versa.

Related

HTML5 input attribute UTF-8, min/max, no special characters

For first validation of an input in HTML5 I want to use the pattern attribute.
What I have so far is:
<INPUT name="firstname" type="text" pattern="[A-Za-z]{2,}" title="2 more characters">
How can I include names that contain other UTF-88 characters but no special signs like question marks, commas and so on?
I think its clear what I want. The user should be able to type only valid first names. That includes "ü", "ñ" and many others.

Regex to detect when certain characters or substrings

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).*" ...

Escaping double quotes in html attribute's value is good/bad practice?

Syntax 1:
<form action="home.html" id="frm-post2" method="post">
<input type="text" placeholder="text" required>
<input type="submit" value="submit">
</form>
Syntax 2:
<form action=home.html id=frm-post method=post>
<input type=text placeholder=Username required>
<input type=submit value=submit>
</form>
both syntax are work perfectly, but which one is best practice syntax1/syntax2
In certain cases, authors may specify the value of an attribute without any quotation marks. The attribute value may only contain letters (a-z and A-Z), digits (0-9), hyphens (ASCII decimal 45), and periods (ASCII decimal 46). I recommend using quotation marks even when it is possible to eliminate them.
Syntax 1 is "correct".
Many thinks work in HTML, however, kinda everyone uses double quotes. You don't have do use them but everyone does.

Invalid regular expression HTML Pattern

This is my Regex:
pattern="[^\!\#\$\%\^\&\*\'\|\"]{8}"
pattern="[^!#$%^&*'|"]{8}"
How is this invalid in my HTML input tag? I want this symbols to be restricted in my textbox
<input placeholder="Something" type="text" required autofocus ng-model="someData" pattern="[^\!\#\$\%\^\&\*\'\|\"]{8}">
I think it should be pattern=\"[^!#$%^&*'|"]{8}\"
You should escape literal double quote outside [] instead of inside.
Demo: https://regex101.com/r/uP5pC6/1

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