Instead, these outlines are only shown after you’ve interacted with the field, which is basically (though not precisely) analogous to the instant, as it could easily be triggered on and off many types in rapid succession while typing, creating a flashing effect which would be annoying or impossibly distracting for some users.
And, in any case, , and frankly that would look nicer, but then we’d have no indication in browsers that don’t support box-shadows, such as IE8.
Once that scripting is implemented, we’re actually only a couple of skips and hops away from a complete polyfill.
Such a script is beyond the scope of this article, but if you wanted to develop it further, all of the basic blocks are there – testing whether a field should be validated, validating a field against a pattern and/or required, and binding trigger events.
We have to be very careful here not to get carried away, creating overly aggressive validation that breaks the natural browsing behavior and gets in people’s way.
In recent versions of Firefox, if a then the field will show a red outline, as illustrated by the following figure. If it did, then every required field would have that outline by default.
So i am looking to see if validation can be added using JS.
Basically when a user clicks on Save button on the new item form, the code should check if Due date field is populated or not, if not then it should show a message in red that you cannot leave due date empty.
Now that we have the static code, we can add the scripting.
The first thing we’ll need is a basic property (the dot property only matches states which are set through scripting).