The Select Object

calendar September 17, 2009

The most complex form control to script is the select element object, this object contains an array of options objects.Some properties belong to the entire select object; others belong to individual options inside the select object.The most important property of the select object is the selected property document.myform.selectName.selectedIndex.

Other properties of an option object are text and value:

document.myform.selectName.options[i].text

document.myform.selectName.options[i].value

Code:

<html>
 <head>
 <title>Select Object</title>
 <script type="text/javascript">
//----------------------------------------------------
 function myfunction()
 {
   var selectList = document.forms[0].myselect;
   alert("Selected text:" + selectList.options[selectList.selectedIndex].text + "\n" +
   "Selected value:" + selectList.options[selectList.selectedIndex].value);
 }
//---------------------------------------------------
 </script>
 </head>
 <body>
 <form>
 <select name="myselect" onchange="myfunction();">
 <option value="1">Home</option>
 <option value="2">Browse</option>
 <option value="3">Search</option>
 </select>
 </form>
 </body>
</html>
admin Forms

Leave a Reply

You must be logged in to post a comment.