Lorenzo Thurman wrote:
When using this code, I can get the value of the select. But this only
works if the select is within a form. The commented code, which I think
_should_ work, does not work whether it's in a form or not. This happens
in both IE6 and Firefox 1.506 and also Flock 0.7.3.2.My javascript
skills are not all that great, but am I missing something?
Yes, an understanding of HTML DOM element properties.
function setStatusText(){
//var index = document.getElementById('bridgeSelect').value;
The reason this line doesn't "work" is because
document.getElementById('bridgeSelect') returns a reference to a div
element, which is a standard HTML DOM element. If you look at the
properties of a normal HTML DOM element, you will see that it doesn't
have a "value" attribute/property:
<URL:
http://developer.mozilla.org/en/docs...ent#Properties >
var str= document.forms['test'].options.value;
In this line, you are using the document's forms collection to get a
reference to the form named 'test', then to the select element named
'options' whose value attribute (in W3C compliant browsers) is the value
of the selected option.
The most widely supported method (though I've forgotten the precise
reason why it is used) is:
var sel = document.forms['test'].elements['options'];
var str = sel[sel.selectedIndex].value;
The first line could be abbreviated to:
var sel = document.test.options;
<URL:
http://www.w3.org/TR/DOM-Level-2-HTM...ionsCollection >
<URL:
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-94282980 >
I would not recommend calling a select element 'options', it is
confusing to me as select elements have an options property that is a
collection of all the options.
document.getElementById('bridgeStatus').innerHTML = str;
}
####################
<body>
<form name='test'>
<div id="bridgeSelect"
onchange="toggleBridgeStatus(false);setStatusText( )"><select
name="options">
<option value="status" selected="yes">Status
<option value="option1">Option1
<option value="option2">Option2
</select>
</div>
</form>
</body>
--
Rob
