I try to use javascript to dynamically modify a select object. That is, I hope to insert some new rows to or delete some rows from the select object.

The following is illustrated in the "http://www.w3schools.com/js/tryit.asp?filename=try_dom_select_remove".

CODE
<html>
<head>
<script type="text/javascript">
function formAction()
{
var x=document.getElementById("mySelect")
x.remove(x.selectedIndex)
}
</script>
</head>

<body>
<form>
<select id="mySelect">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
</select>
<input type="button" onclick="formAction()" value="Remove option">
</form>
</body>

</html>


The x.remove() function does work. The toples in the select object can be removed one by one.

Then I find other methods described in "http://www.w3schools.com/htmldom/dom_obj_select.asp". There shows the add() function.

QUOTE
Methods
Syntax: object.method_name()

Method Description N IE W3C
add() Adds an option to the dropdown list  4 Yes
blur() Removes focus from the dropdown list 3 4 Yes
focus() Sets focus on the dropdown list 3 4 Yes
remove() Removes an option from the dropdown list 6 4 Yes


Then I try to replace the x.remove(x.selectedIndex) by x.add(), but the browser shows an error and nothing happens. I can't not find more detail of the add() method. Can anyone tell me how to use the add() method or where more detail is?

 

 

 


Reply