How to remove selected options from multiple selection fields using Javascript Prototype?

Question

I searched a little for the answer to this question, but no satisfactory result was found.

I have this code:

<select name="items[]" size="0" id="feed-items-list" style="width:100%;" multiple=""> <option value="a">a</option> <option value="b">b</option> <option value="c">c</option> </select> 

How to delete all selected parameters?

Thanks!

Answer 1

To do this with PrototypeJS (as you noted a question)

 $('feed-items-list').select('option:selected').invoke('remove'); 

This will select items using the CSS option:selected selector inside the children of feed-items-list . Then the specific remove method for this element is called.

If you just want to deselect, as Jan mentioned,

 $('feed-items-list').select('option:selected').each(function(i){ i.selected = false; }); 

Answer 2

I know you marked prototypejs , but I have never used it before, and it is easy enough with vanilla JS. Here, like a loop over the <option> and see if they are selected or not:

 var select_element = document.getElementById("feed-items-list"); var options = select_element.options; var i = options.length; while (i--) { var current = options[i]; if (current.selected) { // Do something with the selected option } } 

DEMO: http://jsfiddle.net/tFhBb/

If you want to physically remove this option from the page, use:

 current.parentNode.removeChild(current); 

If you want to deselect, use:

 current.selected = false;