Simplify jQuery code showing/hiding form fields -


i need show selects in form or hide them depending on previous selected option. think code simple, here javascript:

$(document).ready(function() {     $('#a2').hide();     $('#a3').hide();     $('#a5').hide();     $('#a6').hide();     //a8, a9, a11...      $('#a1').change(function(){         if($(this).val() == "1"){             $('#a2').show();             $('#a2').focus();         }         else $('#a2').hide();     });     $('#a2').change(function(){         if($(this).val() == "1"){             $('#a3').show();             $('#a3').focus();         }         else $('#a3').hide();     });     //the same a4, a5, a7... }); 

and here portion of html:

<select name="a1" id="a1">     <option selected="selected">¿conoce?</option>     <option value="1">sí</option>     <option value="0">no</option> </select> <select name="a2" id="a2">     <option selected="selected">¿ha usado?</option>     <option value="1">sí</option>     <option value="0">no</option> </select> <select name="a3" id="a3">     <option selected="selected">¿nota?</option>     <option value="0">0</option>     <option value="1">1</option>     <option value="2">2</option>     <option value="3">3</option>     <option value="4">4</option>     <option value="5">5</option>     <option value="6">6</option>     <option value="7">7</option>     <option value="8">8</option>     <option value="9">9</option>     <option value="10">10</option>     <option value="99">ns/nc</option> </select> //the same a4-a6, a7-a9... 

what want create function without tons of code... have tested next js doesn't work:

$.fn.validar1 = function(elem) {     if(elem.val() == "1"){         elem.next('select').show();         elem.next('select').focus();     }     else elem.next('select').hide(); }   validar1('#a1'); 

i know code bad... i'm starting jquery, please, have mercy :o)

this need, if html , js you've shown got:

$(document).ready(function() {     $('select').hide();      $('select').change(function(){         if($(this).val() == "1"){             $(this).next().show().focus();         }         else $(this).next().hide();     }); }); 

if won't work, make fiddle


Comments

Popular posts from this blog

image - ClassNotFoundException when add a prebuilt apk into system.img in android -

I need to import mysql 5.1 to 5.5? -

Java, Hibernate, MySQL - store UTC date-time -