Search the Community

Hi, what I'm tryng is to append a table row with associated jquery code... I have a jquery code just like this <script type="text/javascript"> jQuery(function($) { var rowCtr = 0; $('.addRow').click(function(){ $('#tableID > tbody:last').append('<tr name="rowEq['+rowCtr+']" id="rowEq['+rowCtr+']"><td>'+ '<select id="stype'+rowCtr+'" name="rowData['+rowCtr+'][equipment_type]">'+ '<option value="0"> -- </option>'+ '<option value="1"> Type 1 </option>'+ '<option value="2"> Type 2 </option>'+ '<option value="3"> Other </option>'+ '</select>'+ '<input id="other_type'+rowCtr+'" type="text" name="rowData['+rowCtr+'][other_type]">'+ ); $('#stype'+rowCtr).change(function() { if(jQuery('#stype'+rowCtr).val() == '3') { jQuery('#other_type'+rowCtr).show(); }else{ jQuery('#other_type'+rowCtr).hide(); } }); if(jQuery( '#stype'+rowCtr ).val() != '3') { jQuery('#other_type'+rowCtr).hide(); } rowCtr++; }); }); </script> And html like this.. <input type='button' class='addRow' value="Add Row"> <form> <table id="tableId"> <thead> <tr> <th> Type </th> </tr> </thead> <tbody> <tr> <td> dummy text.. </td> </tr> </tbody> </table> </form> The appending is ok but the hidding/showing of "other_type" field is not working. It always hide "other_type" field even if I already selected the 'other' option.