Hiding/showing Form Element On Option Select

General Miscellaneous
1

Hi All,

I am a newbie to yii and trying to hide and show form elements based on selection of an option from another field.

My form has a dropDownList with "-/Low/High " and I want to display a low field if low is selected, or a high field if high is selected.

This is my form

<td id="riskDropDownList">

	&lt;?php echo &#036;form-&gt;labelEx(&#036;model,'patient_risk'); ?&gt;


	&lt;?php echo ZHtml::enumDropDownList(&#036;model,'patient_risk',array('style'=&gt;'width:262px;',)); ?&gt;


	&lt;?php echo &#036;form-&gt;error(&#036;model,'patient_risk'); ?&gt;

</td>

<td class="lowRiskField">

	&lt;?php echo &#036;form-&gt;labelEx(&#036;model,'if_risk_low_risk_factor'); ?&gt;


	&lt;?php echo &#036;form-&gt;dropDownList(&#036;model,'if_risk_low_risk_factor', &#036;model-&gt;riskFactorArray()); ?&gt;


	&lt;?php echo &#036;form-&gt;error(&#036;model,'if_risk_low_risk_factor'); ?&gt;

</td>

<td class="highRiskField">

	&lt;?php echo &#036;form-&gt;labelEx(&#036;model,'if_risk_high_risk_factor'); ?&gt;


	&lt;?php echo &#036;form-&gt;dropDownList(&#036;model,'if_risk_high_risk_factor',&#036;model-&gt;riskFactorArray()); ?&gt;


	&lt;?php echo &#036;form-&gt;error(&#036;model,'if_risk_high_risk_factor'); ?&gt;

</td>

and this is my JQuery script

<script type="text/javascript">

$(document).ready(function(){

&#036;(&quot;#riskDropDownList&quot;).change(function() {





if (&#036;(&quot;#riskDropDownList&quot;).val() == 'Low')


{


	&#036;(&quot;.lowRiskField&quot;).show();


}





else if (&#036;(&quot;#riskDropDownList&quot;).val() == 'High')


{


	&#036;(&quot;.highRiskField&quot;).show();


}


else


{      


	&#036;(&quot;.lowRiskField&quot;).hide();


	&#036;(&quot;.highRiskField&quot;).hide();


}





});





&#036;(&quot;#riskDropDownList&quot;).change();

});

</script>

Many thanks for your help in advance

2

Hi,

Have you tried a jQuery piece like "onChange" on your select css #id ? … or a simple "toogle".