Issue Using Regex Pattern in HTML Pattern Attribute
I’m encountering an issue where a regex pattern that works correctly with the .test()
method in JavaScript is not functioning as expected when used within an HTML pattern attribute. Here’s the regex pattern:
/^(?:[A-Z][a-z]*|((?:[A-Za-z]*?)))(?:[-s()]*(?:[A-Z][a-z]*|((?:[A-Za-z]*?))))*$/
When I try to use this pattern in the HTML pattern attribute, like so:
<input type="text" pattern="^(?:[A-Z][a-z]*|((?:[A-Za-z]*?)))(?:[-s()]*(?:[A-Z][a-z]*|((?:[A-Za-z]*?))))*$">
I encounter the error:
Pattern attribute value /^(?:[A-Z][a-z]*|((?:[A-Za-z]*?)))(?:[-s()]*(?:[A-Z][a-z]*|((?:[A-Za-z]*?))))*$/ is not a valid regular expression: Uncaught SyntaxError: Invalid regular expression: //^(?:[A-Z][a-z]*|((?:[A-Za-z]*?)))(?:[-s()]*(?:[A-Z][a-z]*|((?:[A-Za-z]*?))))*$//v: Invalid character in character class
I’m unsure why this error occurs, especially since the regex works as expected in JavaScript. Can anyone provide insight into why this regex pattern is not accepted in the HTML pattern attribute?
Thank you in advance for any help or suggestions!