jquery - Monitoring when a radio button is unchecked -


i have application shows 1 div when radio button selected , hides div when radio button unselected. problem change event attached radio button gets called when radio button checked, not when 1 checked (unchecking previous one). current code follows:

<form name="newreport" action="#buildurl('report.filters')#" method="post">     <dl class="onecolumn">         <dt class="first"><label for="txt_name">name</label></dt>         <dd><input type="text" name="name" id="txt_name" class="text" /></dd>         <dt><strong>type</strong></dt>         <dt><input type="radio" name="type" id="rdo_list" value="list" checked="checked" /><label for="rdo_type" style="display:inline;">list</label></dt>         <dd>list group of records</dd>         <dt><input type="radio" name="type" id="rdo_fields" value="fields" /><label for="rdo_fields" style="display:inline;">field breakdown</label></dt>         <dd>breaks down distinct field values comparison</dd>         <dt><input type="radio" name="type" id="rdo_history" value="history" /><label for="rdo_history" style="display:inline;">historical comparison</label></dt>         <dd>provides record changes on group of years growth comparisons</dd>         <dt><input type="radio" name="type" id="rdo_breakdown" value="breakdown" /><label for="rdo_breakdown" style="display:inline;">student breakdown</label></dt>         <dd>breaks down students school, district or grade</dd>         <div class="reportyear">             <dt><label for="txt_year">year report</label></dt>             <dd><input type="text" name="year" id="txt_year" class="text" value="#year(rc.yearstart)#" /></dd>         </div>         <div class="date-spans" style="display:none;">             <dt><label for="txt_yearstart">year start</label></dt>             <dd><input type="text" name="yearstart" id="txt_yearstart" class="text" value="#evaluate(year(rc.yearstart)-5)#" /></dd>             <dt><label for="txt_yearend">year end</label></dt>             <dd><input type="text" name="yearend" id="txt_yearend" class="text" value="#year(rc.yearstart)#" /></dd>         </div>     </dl> </form>   <script type="text/javascript">     $(function(){         $('##rdo_history').change(function(e){             var ischecked = $(this).attr(checked);             var $datespan = $('form .date-spans');             var $year = $('form .reportyear');              if(ischecked){                 $year.css({display:'none'});                 $datespan.fadein('fast');             }else{                 $datespan.css({display:'none'});                 $year.fadein('fast');             }         });     }); </script> 

it seems pretty simple script, event gets called on check event, not on uncheck event. can tell me why?

handle change event on radio group, not each button. see 1 checked.

here's untested code shows i'm talking :)...

$("input[name='type']").change(function(e){     if($(this).val() == 'history') {         $year.css({display:'none'});         $datespan.fadein('fast');     } else {         $datespan.css({display:'none'});         $year.fadein('fast');     }  }); 

Comments