Apex Code Development You need to sign in to do that
Don't have an account?
Markey1 Visualforce Checkbox Rerender via Ajax - Whats wrong with my code?
I have a checkbox that when checked, the section which contains a save button should appear using ajax render/rerender. What is wrong with my code? Also, I'm using DIVs to control look and feel... is there a better way to do this using panels etc?
Class:
public String test2 {get; set;}
Page:
<div id = "body_row">
<apex:pageblock id="test">
<apex:pageBlockSection>
<apex:pageBlockSectionItem >
<apex:inputCheckbox value="{!test2}" />
<apex:actionsupport event="onclick" rerender="termsandconditions" />
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageblock>
</div>
<div id = "body_row">
<apex:pageblock id="termsandconditions">
<apex:messages />
<apex:pageblockButtons location="bottom" rendered="{IF({!test2} == true,true,false)}">
<apex:commandButton action="{!Save}" value="Submit Enrollment" />
</apex:pageblockButtons>
</apex:pageblock>
</div>
In this case you are trying to attach an action to the inputcheckbox component, so the actionsupport needs to be a child of that.
E.g.
<apex:inputCheckbox value="{!test2}"> <apex:actionsupport event="onchange" rerender="termsandconditions" /> </apex:inputCheckbox>All Answers
You've got a few things wrong. First of all, since you've got a checkbox, you might as well make "test2" a boolean instead of a string. That way your rendered attribute would be simply rendered="{!test2}" (for the record, the syntax you had wasn't even correct, it would be more like "{!IF(test2 == 'true', true, false)}")
And then additionally, your actionSupport component needs to be the child component of what you're trying to attach an action to. So it should be a child component of your inputCheckbox. Try that out and let me know if it works.
You can use javascript to perform this task. See below a sample code :
<apex:page controller="cls_rendercheckbox" id="PageId">
<apex:form>
<apex:pageblock >
<apex:pageBlockSection>
<apex:pageBlockSectionItem >
<apex:inputCheckbox value="{!test2}" onclick="showbutton()"/>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageblock>
<apex:pageblock>
<apex:messages />
<apex:pageBlockButtons location="bottom">
<apex:commandButton action="{!Save}" value="Submit Enrollment" id="showit" style="display:none" />
</apex:pageBlockButtons>
</apex:pageblock>
</apex:form>
<script>
function showbutton()
{
alert('hi');
document.getElementById('{!$Component.PageId:formid:pageblockid:idpage:showit}').style.display = 'block';
}
</script>
</apex:page>
Hope this helps.
I think this line may be confusing things:
<apex:pageblockButtons location="bottom" rendered="{IF({!test2} == true,true,false)}">test2 doesn't need to be inside its own merge decorators, rather the whole IF statement should be
Try:
<apex:pageblockButtons location="bottom" rendered="{!IF(test2 == true,true,false)}">I would also expect the following to work:
<apex:pageblockButtons location="bottom" rendered="{!test2}">but I've found that sometimes I have to use the IF syntax even though its not adding anything.
Thank you for getting me started. I'm still a noob... can you please provide more guidance on how the "actionSupport component needs to be a child componenet of what you're trying to attach an action to". My code:
Class:
public Boolean test2 {get; set;}Page:
<div id = "body_row"> <apex:pageblock id="test"> <apex:pageBlockSection > <apex:pageBlockSectionItem > <apex:inputCheckbox value="{!test2}" /> <apex:actionsupport event="onclick" rerender="termsandconditions" /> </apex:pageBlockSectionItem> </apex:pageBlockSection> </apex:pageblock> </div> <div id = "body_row"> <apex:pageblock id="termsandconditions"> <apex:messages /> <apex:pageblockButtons location="bottom" rendered="{!IF(test2 == true,true,false)}"> <apex:commandButton action="{!Save}" value="Submit Enrollment" /> </apex:pageblockButtons> </apex:pageblock> </div>In this case you are trying to attach an action to the inputcheckbox component, so the actionsupport needs to be a child of that.
E.g.
<apex:inputCheckbox value="{!test2}"> <apex:actionsupport event="onchange" rerender="termsandconditions" /> </apex:inputCheckbox>Bob Buzzard, you are brilliant! This was the missing link. Thank you to both of you for helping me get this sorted out!