jquery - Show/Hide options in a select -


i got problem ie.

got input , select :

<input type="radio" checked="" value="par" name="marche">particulier <input type="radio" value="pro" name="marche">pro/tpe <input type="radio" value="ent" name="marche">entreprise   <select id="typedeproduit" name="typedeproduit"> <option class="par" value="21" style="display: block;">g9119a mrh gan habitat globale     </option> <option class="par" value="22" style="display: block;">g9120a mrh gan habitat confort     </option> <option class="pro" value="24" style="display: none;">g6020a - rcce </option> <option class="pro" value="25" style="display: none;">g6006a - autre rc </option> <option class="pro" value="27" style="display: none;">g9001a - stella (- de 10 m     engagement et/ou -de 5 étoiles) </option> <option class="ent" value="42" style="display: none;">g7009a - dommages divers entreprise </option> <option class="ent" value="43" style="display: none;">g2004a - individuelles entreprise </option> <option class="par" value="6" style="display: block;">g4102a 2-3 roues (2 roues - quad-voiturette, …) </option> </select> 

i want hide , show options selected value in radio named "marche".

i made in jquery :

in jquery function :  $("input:radio[name=marche]").change(function(){     cachertoustypesdeproduit();     rafraichirlistetypedeproduit(); });   function cachertoustypesdeproduit(){     $("#typedeproduit>option").hide(); }  function rafraichirlistetypedeproduit(){     var typedeproduitselectionne = $("input:radio[name=marche]:checked").val();     $("#typedeproduit>option[class="+typedeproduitselectionne+"]").show(); } 

it works in firefox, not in ie. there knows why doesn't work in ie ?

the notion of hidden options in select doesn't exist in ie. have manually remove , re-add entries, may of inconvenience.

another solution disable elements

 $("input:radio").on('change click',function(){         $("select#typedeproduit > option").hide().prop('disabled', false);         cachertoustypesdeproduit();         rafraichirlistetypedeproduit();     });       function cachertoustypesdeproduit(){         $("select#typedeproduit > option").hide().prop('disabled', true);         $("select#typedeproduit").val('');     }      function rafraichirlistetypedeproduit(){         var typedeproduitselectionne = $("input:radio[name=marche]:checked").val();         console.log(typedeproduitselectionne);         $("#typedeproduit > option[class="+typedeproduitselectionne+"]").hide().prop('disabled', false);     } 

demo


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -