data of list form

liunx

Guest
Having a list form with various options, how can i know witch one of this options is selected at a given time, and performe some action ...<br />
<br />
In other words, how can i access the data of my list.<!--content-->You can access the data via javascript:<br />
<br />
Through select element object (<SELECT>) you can access a collection, or array (e.g. group), of option objects (<OPTION>). Each option has a number of properties. One of these properties are the selected property which will either be true or false depending on whether the particular option have been selected. If the keyword MULTIPLE was included in the select element (<SELECT NAME='myselect' MULTIPLE>) then more options can have the selected property set to true, otherwise only one option will have a true setting. <br />
<br />
Another usefull feature of the Select element is an index indicator: selectedIndex. It indicates which of the options have been selected. The options are, as mentioned, considered a dense array (e.g. a group or collection of option elements starting with the identifier: 0, the next is 1, the next is 2, and so forth). The selectedIndex identifier will tell you which option element was selected.<br />
<br />
Examples:<br />
<br />
<br />
<form name='myform'><br />
<select name='myselect'><br />
<option value='100'>Hundred</option> <!-- option 0 --><br />
<option value='10'>Ten</option> <!-- option 1 --><br />
<option value='1'>One</option> <!-- option 2 --><br />
<option value='0' SELECTED>Zero</option> <!-- option 3 --><br />
</select><br />
</form><br />
<br />
Javascript:<br />
<br />
var Elm = document.myform.myselect;<br />
var option0 = Elm.options[0];<br />
var option1 = Elm.options[1]; <br />
alert (option0.value); // result: 100<br />
alert (option1.value); // result: 10<br />
alert (option1.text); // result: Ten<br />
<br />
alert (option1.selected); // result: false;<br />
<br />
alert(document.myform.myselect.options[3].selected); // result: true;<br />
<br />
alert(document.myform.myselect.options[3].value); // result: 0;<br />
<br />
alert(document.myform.myselect.selectedIndex); // result: 3;<br />
<br />
To get selected option:<br />
<br />
var Elm = document.myform.myselect;<br />
var selOption = Elm.options[Elm.selectedIndex];<br />
alert(selOption.value); // result: 0;<br />
alert(selOption.text); // result: Zero;<br />
<br />
Another quick example:<br />
<br />
<script language="javascript"><br />
<!--<br />
function showMe(form){<br />
var SelElm = form.myselect;<br />
var val = SelElm.options[SelElm.selectedIndex].value;<br />
var txt = SelElm.options[SelElm.selectedIndex].text;<br />
form.output.value = ("You chose: text:"+txt+" with value: "+val+".");<br />
}<br />
//--><br />
</script><br />
<br />
<form name='myform'><br />
Select a number: <br /><br />
<select name='myselect'><br />
<option value='1' SELECTED>One</option><br />
<option value='2'>Two</option><br />
<option value='3'>Three</option><br />
<option value='4'>Four</option><br />
<option value='5'>Five</option><br />
<option value='6'>Six</option><br />
<option value='7'>Seven</option><br />
</select><br />
<br /><br />
<input type="text" size="30" value="" name='output'><br />
<br /><br />
<input type="button" value="show" onclick="showMe(this.form)"><br />
<br /><br />
</form><br />
<br />
<br />
The the above example in an html page and select different values.<br />
<br />
Good luck.<!--content-->it really all depends on what you want to do with it and if they push a button. you can do a lot of this in the server side with server side language like php, asp, cgi. like I said it all depends on what you want to do with it.<!--content-->
 
Back
Top