If an has a pattern attribute, is there value to also including the required attribute?
If, for example, you have:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}">
does adding "required", as in:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}" required>
add any value or functionality? Everything seems to operate the same, but I'm wondering if I missed some subtlety.
html5 forms
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
add a comment |
If, for example, you have:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}">
does adding "required", as in:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}" required>
add any value or functionality? Everything seems to operate the same, but I'm wondering if I missed some subtlety.
html5 forms
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
add a comment |
If, for example, you have:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}">
does adding "required", as in:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}" required>
add any value or functionality? Everything seems to operate the same, but I'm wondering if I missed some subtlety.
html5 forms
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
If, for example, you have:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}">
does adding "required", as in:
<input type="text" name="username" pattern="[a-z][a-z0-9]{2,7}" required>
add any value or functionality? Everything seems to operate the same, but I'm wondering if I missed some subtlety.
html5 forms
html5 forms
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
asked Nov 25 '18 at 0:45
John HascallJohn Hascall
7,60643760
7,60643760
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
In html5, "required: attribute is added to make the field mandatory. Otherwise it will throw an error on form submit.
And if you type any input value, pattern will validate accordingly.
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
add a comment |
According to Section 4.10.5.3.6. "The pattern attribute" of the HTML5 Standard the pattern is only checked if the input's value is the non-empty:
If the element’s value is not the empty string, ... and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element’s value, then the element is suffering from a pattern mismatch.
So, to prevent the submission of the form with an empty value, the required attribute is (also) required (even if an empty string does not match the pattern).
Note: this also applies to the HTML5 constraint validation API.
If the input is empty then input.validity.valid will be true and input.validity.patternMismatch will be false and unless the required attribute is also present, then input.validity.valueMissing will also be false.
[fyi: As of this writing, the API is widely supported, although IE and Blackberry mess up some aspects]
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53463732%2fif-an-input-has-a-pattern-attribute-is-there-value-to-also-including-the-requ%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
In html5, "required: attribute is added to make the field mandatory. Otherwise it will throw an error on form submit.
And if you type any input value, pattern will validate accordingly.
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
add a comment |
In html5, "required: attribute is added to make the field mandatory. Otherwise it will throw an error on form submit.
And if you type any input value, pattern will validate accordingly.
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
add a comment |
In html5, "required: attribute is added to make the field mandatory. Otherwise it will throw an error on form submit.
And if you type any input value, pattern will validate accordingly.
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
In html5, "required: attribute is added to make the field mandatory. Otherwise it will throw an error on form submit.
And if you type any input value, pattern will validate accordingly.
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
answered Nov 26 '18 at 5:36
Padmapriya VishnuvardhanPadmapriya Vishnuvardhan
902310
902310
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
add a comment |
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes, but unless your pattern matches the empty string, having a pattern seems to have exactly that effect as well.
– John Hascall
Nov 26 '18 at 13:11
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
Yes as you say if you add a pattern it will surely ask for the input and validate accordingly, but required is something different and would be used during form submit making the form not valid. Just try with pattern alone and try form submit without entering any input value to your text field.
– Padmapriya Vishnuvardhan
Nov 27 '18 at 4:43
add a comment |
According to Section 4.10.5.3.6. "The pattern attribute" of the HTML5 Standard the pattern is only checked if the input's value is the non-empty:
If the element’s value is not the empty string, ... and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element’s value, then the element is suffering from a pattern mismatch.
So, to prevent the submission of the form with an empty value, the required attribute is (also) required (even if an empty string does not match the pattern).
Note: this also applies to the HTML5 constraint validation API.
If the input is empty then input.validity.valid will be true and input.validity.patternMismatch will be false and unless the required attribute is also present, then input.validity.valueMissing will also be false.
[fyi: As of this writing, the API is widely supported, although IE and Blackberry mess up some aspects]
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
add a comment |
According to Section 4.10.5.3.6. "The pattern attribute" of the HTML5 Standard the pattern is only checked if the input's value is the non-empty:
If the element’s value is not the empty string, ... and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element’s value, then the element is suffering from a pattern mismatch.
So, to prevent the submission of the form with an empty value, the required attribute is (also) required (even if an empty string does not match the pattern).
Note: this also applies to the HTML5 constraint validation API.
If the input is empty then input.validity.valid will be true and input.validity.patternMismatch will be false and unless the required attribute is also present, then input.validity.valueMissing will also be false.
[fyi: As of this writing, the API is widely supported, although IE and Blackberry mess up some aspects]
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
add a comment |
According to Section 4.10.5.3.6. "The pattern attribute" of the HTML5 Standard the pattern is only checked if the input's value is the non-empty:
If the element’s value is not the empty string, ... and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element’s value, then the element is suffering from a pattern mismatch.
So, to prevent the submission of the form with an empty value, the required attribute is (also) required (even if an empty string does not match the pattern).
Note: this also applies to the HTML5 constraint validation API.
If the input is empty then input.validity.valid will be true and input.validity.patternMismatch will be false and unless the required attribute is also present, then input.validity.valueMissing will also be false.
[fyi: As of this writing, the API is widely supported, although IE and Blackberry mess up some aspects]
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
According to Section 4.10.5.3.6. "The pattern attribute" of the HTML5 Standard the pattern is only checked if the input's value is the non-empty:
If the element’s value is not the empty string, ... and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element’s value, then the element is suffering from a pattern mismatch.
So, to prevent the submission of the form with an empty value, the required attribute is (also) required (even if an empty string does not match the pattern).
Note: this also applies to the HTML5 constraint validation API.
If the input is empty then input.validity.valid will be true and input.validity.patternMismatch will be false and unless the required attribute is also present, then input.validity.valueMissing will also be false.
[fyi: As of this writing, the API is widely supported, although IE and Blackberry mess up some aspects]
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
answered Nov 27 '18 at 8:47
John HascallJohn Hascall
7,60643760
7,60643760
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53463732%2fif-an-input-has-a-pattern-attribute-is-there-value-to-also-including-the-requ%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
