Apex Code Development You need to sign in to do that
Don't have an account?
SelectRadio & AJAX updates - some simple issues
Hey guys,
I'm having a basic issue with the <apex:selectradio> component and AJAX updates. I simply want a pagesection to render based upon whether a certain radio option has been selected. However, I'm encountering two problems:
1) The onchange event seems to fire at odd times (i.e. when I click an unrelated component on the screen, or not at all when I change the radio options
2) I can't get the section to render (which I'm sure is just a case of my not being very capable with the controller behind the scenes.
Visualforce Code
<apex:pageblock title="Additional Required Information"> <apex:outputtext value="Will the status last for a set period of time or covered by a set amount of revenue? (select one)" /> <apex:pageblocksection columns="2"> <apex:outputpanel id="ScopeOptions"> <apex:selectRadio layout="pageDirection" value="{!ScopeOption}"> <apex:actionSupport event="onchange" status="ScopePleaseWait" reRender="NumberOfMonths" /> <apex:selectOptions value="{!Scopes}" /> </apex:selectRadio> </apex:outputpanel> <apex:pageblocksectionitem /> </apex:pageblocksection> <apex:outputpanel id="NumberOfMonths"> <apex:actionstatus id="ScopePleaseWait" startText="Please Wait ..... Acquiring Additional Question..."> <apex:facet name="stop"> <apex:pageblocksection rendered="{!Scopes = 'Time'}"> <apex:outputlabel value="THIS RENDERED BECAUSE THE TIME OPTION WAS SELECTED!" /> </apex:pageblocksection> </apex:facet> </apex:actionstatus> </apex:outputpanel> </apex:pageblock>
Apex Code
public List<SelectOption> getScopes(){ List<SelectOption> scopes = new List<SelectOption>(); scopes.add(new SelectOption('Time','Time')); scopes.add(new SelectOption('Revenue','Revenue')); return scopes; } public string getScopeOption(){ return ScopeOption; } public void setScopeOption(string ScopeOption){ this.ScopeOption = ScopeOption; }
I'm sure that it's a case of incorrect coding, but would love a pointer. I'm no expert when it comes to coding, in general.
Thanks!
Try these:
<apex:page controller="Travelling" > <apex:form > <apex:pageblock title="Additional Required Information" id="theBlock"> <apex:outputtext value="Will the status last for a set period of time or covered by a set amount of revenue? (select one)" /> <apex:pageblocksection columns="1"> <apex:outputpanel id="ScopeOptions"> <apex:selectRadio layout="pageDirection" value="{!ScopeOption}"> <apex:actionSupport event="onclick" status="ScopePleaseWait" reRender="theBlock" /> <apex:selectOptions value="{!Scopes}" /> </apex:selectRadio> </apex:outputpanel> <apex:actionstatus id="ScopePleaseWait" startText="Please Wait ..... Acquiring Additional Question..."/> </apex:pageblocksection> <apex:pageblocksection rendered="{!ScopeOption == 'Time'}"> <apex:outputlabel value="THIS RENDERED BECAUSE THE TIME OPTION WAS SELECTED!" /> </apex:pageblocksection> </apex:pageblock> </apex:form> </apex:page>
public class Travelling { public String ScopeOption {get; set;} public List<SelectOption> getScopes() { List<SelectOption> scopes = new List<SelectOption>(); scopes.add(new SelectOption('Time','Time')); scopes.add(new SelectOption('Revenue','Revenue')); return scopes; } }
All Answers
Try these:
<apex:page controller="Travelling" > <apex:form > <apex:pageblock title="Additional Required Information" id="theBlock"> <apex:outputtext value="Will the status last for a set period of time or covered by a set amount of revenue? (select one)" /> <apex:pageblocksection columns="1"> <apex:outputpanel id="ScopeOptions"> <apex:selectRadio layout="pageDirection" value="{!ScopeOption}"> <apex:actionSupport event="onclick" status="ScopePleaseWait" reRender="theBlock" /> <apex:selectOptions value="{!Scopes}" /> </apex:selectRadio> </apex:outputpanel> <apex:actionstatus id="ScopePleaseWait" startText="Please Wait ..... Acquiring Additional Question..."/> </apex:pageblocksection> <apex:pageblocksection rendered="{!ScopeOption == 'Time'}"> <apex:outputlabel value="THIS RENDERED BECAUSE THE TIME OPTION WAS SELECTED!" /> </apex:pageblocksection> </apex:pageblock> </apex:form> </apex:page>
public class Travelling { public String ScopeOption {get; set;} public List<SelectOption> getScopes() { List<SelectOption> scopes = new List<SelectOption>(); scopes.add(new SelectOption('Time','Time')); scopes.add(new SelectOption('Revenue','Revenue')); return scopes; } }
Venkat,
Thank you for your reply. Unfortunately, that doesn't seem to have fixed the rendering. However, the first point is fixed, so thank you!
The full code for the page is pretty complicated, with one other AJAX update and some validation rules in place for the page. Is there anyway that these are interfering with the re-render? Currently, the pageblock never renders in the code form you've kindly provided.
I've experimented by changing the formula that controls when the final pageblocksection renders. It seems that the pageblocksection renders according to the formula logic when the page first loads, but not on subsequent AJAX updates. It doesn't seem to recognise a change in state of the page itself.
Any ideas?
With thanks
Any ideas?
Venkat,
Thanks for your help. You were right all along and I made some copy errors. Additionally, I had to employ a number of action:regions and re-jig some code to avoid any validation problems I was having.
Thanks again!