Sent by Ben Henick on 9 January 2004 22:10
On Fri, 9 Jan 2004, CSS LIST EMAIL wrote:
> What I'd like to do is provide a visual method of which fields are required,
> which I am pretty sure I've got down now. I have a thin red border around
> the fields, as well as an asterisk and bold face labels for those required
> fields. But, for SELECT elements, CHECKBOX and RADIO buttons - I don't know
> what to do.
The 3d parts of those elements are not (unfortunately) exposed to valid
CSS in any browser of which I'm aware...
> Also, more importantly, once the JavaScript does the validation - how can I
> change the bad entry, visually, using a different style. Maybe something
> like a totally red background in a text box? Or a GIF next to the label...
> Something like that. Basically, I am not sure how I'd dynamically switch
> the style of the bad field. That's what I'd really looking to do.
Each of your fields has a name attached. So:
document.forms[0].elements["someElement"].style.foo = "someValue";
should do the trick.
You may want instead to work with your form element *labels*, which is
somewhat more of a challenge.
Let's suppose that you've assigned a class to each of your labels, for
example:
#myForm .labelClass {
background-color: white;
color: black;
}
Thus:
var formReference = document.getElementById("myForm").firstChild;
do {
if ((formReference.className == "labelClass") && (inputError)) {
// where inputError likely represents the result of a test against
// an array value...
formReference.style.color = "red"; }
// for example...
formReference = formReference.nextSibling; }
while {
formReference !== null; }
HTH,
--
Ben Henick "In the long run, men hit only what they aim
Web Author At-Large at. Therefore, though they should fail
http://www.io.com/persist1/ immediately, they had better aim high."
[EMAIL-REMOVED] -- Henry David Thoreau
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
