Knockout-Contrib
HTML5 attributes: no error css class applied to validated element in these cases?
Hello guys.
I've built a small demo which shows the problem: http://jsfiddle.net/luisabreu/WMdLb/5/
It seems like using the html5 required attribute is not enough for getting a validation error when a field is empty. Removing the extend method comment makes it work as expected though.
Your code seems to be working okay for me. It is validating in both cases.
Hello.
but it's not applying the error css style to the textbox. removing the comment from extend method call does end up applying the css class to the textbox...
It is doing so, i mean applying the css, but it looks little diffrent from the one you have used manually.
Well, I've run the jsfiddle sample on several browsers and the only way to get the red border is by removing the commented extend method call. are you saying that running this sample (without re extend call) works in your pc?
remove the required="required" from input element in your html, and also comment out the extend method, now run it and notice the border color of input. Now add the required="required" attribute, leave the extend method commented and run it. compare both the results, you will find something is happening :)
Although i have never used the html5 validation in any project, but it seems like this attribute is using its own builtin styles. It will not apply the apply the styles you have defined in error class.
this might answer your question. http://stackoverflow.com/questions/5478800/override-css-for-html5-form-validation-required-popup
try placing the the mouse over the input field, after adding required attribute on input while extend remains commented. You will see this "Please fill out this field."
ah, now I understand what you're saying :)
Yes, that's the default behavior and I wasn't seeing it because I was using chrome (which doesn't support the html5 validation attributes yet). Now, my problem isn't really the html5 validation and its default beahvior. My question is getting knockout validation library to read validation rules from the input controls and applying the error styles to the input controls which aren't valid. According to the docs, it should be able to build the rules from the attributes (I think it can do this). the problem is that it's not applying the error element style class when you don't make the extend method call (and this can also be seen when you run the sample in IE or opera).
