[thelist] Netscape Bugginess

[.jeff]

stephen,

><><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> From: Stephen Caudill
>
> Im still a newbie to dynamic pages (including
> JavaScript), so I hope you won't slap me too hard...
><><><><><><><><><><><><><><><><><><><><><><><><><><><><><

well, the slap was in jest.

><><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> It is important to me to design accessible pages though,
> so I do appreciate the tip (you should take a look at
> http://www.municode.com and see the legacy code I'm
> converting and you might redirect your slapping hand).
><><><><><><><><><><><><><><><><><><><><><><><><><><><><><

wow, that's insanely wrong.  i feel for you.

make sure you ditch the status writing onmouseover and that silly text swapping in the right sidebar.  that's just horrid.

><><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> I dont understand the doubling up on the way you
> reference the values through the DOM, though.
><><><><><><><><><><><><><><><><><><><><><><><><><><><><><

most form element types don't require this.  a text field for example can be referenced a couple of ways (assume for the example code this is the first form on the page and the first element in that form):

document.formName.elementName.value;
document.forms[0].elements[0].value;
document.formName.elements[0].value;
document.forms[0].elementName.value;
document.forms['formName'].elements['elementName'].value;

there are additional combinations depending on how you want to mix and match stuff above.

a select-one or select-multiple form element works slightly differently.  think about the <select> tag and it's available attributes.  does it have a value attribute?  the answer is no.  a <select> tag has any number of child <option> tags, each of which has a value attribute.  the <option> tags are available via an options array as a property of the select-one and select-multiple objects.  like so:

document.forms[0].elements[0].options;

by referencing a particular index in the options array we can then access the text and value properties of that object and get the value of any option.

document.forms[0].elements[0].options[0].value;

so how do you find the value of the option that's selected?  well, there's a handy property of the select-one and select-multiple objects.  this property is the selectedIndex property.  it contains the index of the selected option.  so, by using a reference to that property in the options array, we can get the value of the selected option:

var oElement = document.forms[0].elements[0];
oElement.options[oElement.selectedIndex].value;

there's a gotcha with the selectedIndex property when working with select-multiple objects though.  no matter how many options are selected, selectedIndex will always return the index of the last item that was selected.  there's a way around that though.  each option has a selected property that contains a boolean true or false.  by looping over the options array you can check the selected property of each option to see if it's selected or not and behave accordingly.  maybe you'd want to store all the indexes in a list or array to use for a calculation elsewhere.  maybe you want to set all the options to selected.  it's up to you.

hope this helps,

.jeff

http://evolt.org/
jeff at members.evolt.org
http://members.evolt.org/jeff/