Quack
asked on
Regex not working with style="text-transform:uppercase"
I have a report that works with a regex and validates well enough w/ the regex. The client is asking to force the date field to be all caps though. I can add the style - style="text-transform:uppe rcase" - to force this but when I do it throws an error. Anyone have any idea why this would happen? code below:
<cfinput type="text"
name="period"
validate="regex"
pattern="^(JAN|FEB|MAR|APR|JUN|JUL|AUG|SEP|OCT|NOV|DEC)-(19|20)[0-9]{2}$"
message="Please enter the Accounting Period in the correct format, i.e. MON-YYYY."
required="true"
id="period"
class="Headline12DrkBlu"
size="10"
maxlength="8"
default="#period#">
But if you add the style to force the all caps it errors out:
<cfinput type="text"
style="text-transform:uppercase"
name="period"
validate="regex"
pattern="^(JAN|FEB|MAR|APR|JUN|JUL|AUG|SEP|OCT|NOV|DEC)-(19|20)[0-9]{2}$"
message="Please enter the Accounting Period in the correct format, i.e. MON-YYYY."
required="true"
id="period"
class="Headline12DrkBlu"
size="10"
maxlength="8"
default="#period#">
ASKER
it posts the validation message and won't allow me to continue - Please enter the Accounting Period in the correct format, i.e. MON-YYYY.
not the best choice of words...error I mean...the regex is catching it even though its posting all caps. so you're saying its not really all caps? how can I work it to fix that?
not the best choice of words...error I mean...the regex is catching it even though its posting all caps. so you're saying its not really all caps? how can I work it to fix that?
adding this ugly thing may work :)
or this one is better
or obblur
onkeypress="javascript:this.value=this.value.toUpperCase();"
or this one is better
onkeyup="javascript:this.value=this.value.toUpperCase();"
or obblur
onblur="javascript:this.value=this.value.toUpperCase();"
see this demo
https://jsfiddle.net/HainKurt/4wLdqd9p/
adding a style
+ one of those solutions above is what you need...
https://jsfiddle.net/HainKurt/4wLdqd9p/
adding a style
.uppercase {
text-transform: uppercase;
}
+ one of those solutions above is what you need...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
(UPPER('#form.period#')) vs. '#form.period#' within in the code converts to upper case which fixes the issue ... I pulled the regex completely out of the form field which removed the conflict.
can you share that error with us :)
issue may be UPPERCASE is just visual, fake,
If you enter "Dec", you see "DEC" but regex uses value "Dec", so it throws the message...