Question

I need to hide certain options from Multiple selection box using Javascript. I can’t got for jQuery, and I am not allowed to.

I have one more dropdown box, I am calling a js function which will be called upon change of the value. The js function will control the options of another multiple select options box, where I need to hide (not remove) options based on dropdown box value.

Any simple js function?

http://jsfiddle.net/zz3dg/

Edit:
tried

fastInternet.options[i].style.display = 'none';
fastInternet.options[i].style.visibility = 'hidden';

Didn’t work 🙁

Answer 1

I tried using your jsFiddle link but some of the stuff there was prevented the method from working correctly.

I made some modifications and it’s working perfectly:

html:

<select id="option_two" multiple>        
  <option value="VOIP">VOIP</option>         
  <option value="BDS">BDS</option>          
  <option value="DMW">DMW</option>          
  <option value="IDTV">IDTV</option>          
  <option value="P3TR">P3TR</option> 
</select> 

Javascript:

 var fastInternet = document.getElementById('option_two');

 for ( var i = 0; i < fastInternet.options.length; i++) {
     var value = fastInternet.options[i].value;

     if(value == 'IDTV' || value == 'P3TR'){
        fastInternet.options[i].style.visibility = 'hidden';
     }
 }​

In JsFiddle, make sure that the framework is set to onLoad and No-Library(pure JS)
In chrome it worked. But I got some problems in IE though :/