Change all label appearances

[knoak]

Hi there,

In my form, after validation, labels of wrong
fields are turned into a red color.
What i want now is when you hit 'reset', to make all
the labels grey again.

I have the next code:
======================================
function GrayLabels()
{
var label;
label = document.getElementById(label);
if (label && label.style) {
label.style.color = '#A2A2A2';
};
=======================================

So reset will have onClick="GrayLabels()" in it. But how
do i automatically apply this to everey label in the document?

Hope this is clear enough and thanks in advance..

Greetings

[Grant Wagner]

knoak wrote:

Hi there,

In my form, after validation, labels of wrong
fields are turned into a red color.
What i want now is when you hit 'reset', to make all
the labels grey again.

I have the next code:
======================================
function GrayLabels()
{
var label;
label = document.getElementById(label);
if (label && label.style) {
label.style.color = '#A2A2A2';
};
=======================================

So reset will have onClick="GrayLabels()" in it. But how
do i automatically apply this to everey label in the document?

Hope this is clear enough and thanks in advance..

Greetings

Assuming you truly mean _every_ label in the document, you could
use:

<script type="text/javascript">
function setLabelColor(labelColor) {
if (document.getElementsByTagName) {
var labels = document.getElementsByTagName('label');
if (labels) {
for (var i = 0; i < labels.length; i++) {
if (labels[i] && labels[i].style) {
labels[i].style.color = labelColor;
}
}
}
}
}
</script>
<label id="one">ONE</label>
<label id="two">TWO</label>
<label id="three">THREE</label>
<br>
<button onclick="setLabelColor('Gray');">Make Gray</button>
<button onclick="setLabelColor('Black');">Make Black</button>

If you only want specific labels, you could set their ID to a
specific prefix, then retrieve all labels and ignore those without
the prefix:

if (labels[i] && labels[i].style &&
labels[i].id.indexOf('yourPrefix') == 0) {

labels[i].style.color = labelColor;
}

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available
at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

[Thomas 'PointedEars' Lahn]

knoak wrote:

In my form, after validation, labels of wrong
fields are turned into a red color.
What i want now is when you hit 'reset', to make all
the labels grey again.

You need to retrieve the collection of all LABEL elements.

W3C DOM:
document.getElementsByTagName("label")

IE4 DOM:
document.all.tags("label")

NS4 DOM:
document.layers[number] if the elements are positioned

Then iterate through the collection. Assign the empty string ("") to
the respective CSS property to assign the initial value after all CSS
rules have been rendered:

var coll = null;

if (document.getElementsByTagName) // W3C DOM
{
coll = document.getElementsByTagName("label");
}
else if (document.all && document.all.tags) // IE4 DOM
{
coll = document.all.tags("label");
}

if (coll && coll.length)
{
for (var i = 0, len = collection.length; i < len; i++)
{
if ((o = collection[i].style) && typeof o.color != undefined)
{
o.color = "";
}
}
}
PointedEars