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
Post a Comment