Apex Code Development You need to sign in to do that
Don't have an account?
Siana Dcruz No observable hide/show effects when page is rerendered
Hi all,
I need some help in my code. In the code below what I am trying to do is when the user selects GUEST i want the guest section should be shown up and hide when user selects EMPLOYEE. But my rerender attribute will cause the guest section to be shown up even when the user selects EMPLOYEE. In general I can say there are no observable hide/show effects. Please help me solve this issue.
<script>
$(document).ready(function() {
$('.selectRadioinput').click(function(e) {
var val = e.target.value;
if (val == 'employee') {
$('.guest_section').hide();
}
else if (val == 'Guest') {
$('.guest_section').show();
}
});
});
</script>
<apex:selectRadio layout="lineDirection" styleClass="selectRadio" id="selectrole" value="{!role}" required="false" >
<apex:selectOptions value="{!recordTypeOptions}" /> <!--options are: 1)employee 2)Guest -->
<apex:actionsupport event="onclick" rerender="out" />
</apex:selectRadio>
<apex:outputPanel id="out" >
<div class="guest_section">
<!--some text-->
</div>
</apex:outputPanel>
I need some help in my code. In the code below what I am trying to do is when the user selects GUEST i want the guest section should be shown up and hide when user selects EMPLOYEE. But my rerender attribute will cause the guest section to be shown up even when the user selects EMPLOYEE. In general I can say there are no observable hide/show effects. Please help me solve this issue.
<script>
$(document).ready(function() {
$('.selectRadioinput').click(function(e) {
var val = e.target.value;
if (val == 'employee') {
$('.guest_section').hide();
}
else if (val == 'Guest') {
$('.guest_section').show();
}
});
});
</script>
<apex:selectRadio layout="lineDirection" styleClass="selectRadio" id="selectrole" value="{!role}" required="false" >
<apex:selectOptions value="{!recordTypeOptions}" /> <!--options are: 1)employee 2)Guest -->
<apex:actionsupport event="onclick" rerender="out" />
</apex:selectRadio>
<apex:outputPanel id="out" >
<div class="guest_section">
<!--some text-->
</div>
</apex:outputPanel>
hope the below code will work like you expected.
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> <script> $(document).ready(function(){ $('select[class=selectRadio]').change(function() { var value = $('select[class=selectRadio]').val(); alert(value); if(value==='Guest'){ $('.guest_section').show(); }else{ $('.guest_section').hide(); } }); }); </script> <apex:selectRadio layout="lineDirection" styleClass="selectRadio" id="selectrole" value="{!role}" required="false" > <apex:selectOptions value="{!recordTypeOptions}" /> <!--options are: 1)employee 2)Guest --> <apex:actionsupport event="onclick" rerender="out" /> </apex:selectRadio> <apex:outputPanel id="out" > <div class="guest_section"> <!--some text--> </div> </apex:outputPanel>check and let me know.
Thanks
D Naveen Rahul.