I want to select 1 of 2 (or 1 of 3) radio buttons and have certain pageblocksections. I tried to follow about a dozen examples but to no avail. The 2 I have been try to get to work are below.
My VF code:
<apex:outputPanel >
<apex:pageBlockSection id="resourceSection" >
<apex:pageBlockSectionItem labelStyleClass="FRDformApplicationLabel">
<apex:selectRadio onchange="checkoldNewRes(this)" layout="lineDirection"
styleClass="FRDformApplicationRadioOpt" value="{!oldNewRes}" id="choose1" >
<apex:selectOption itemValue="OLD" itemLabel="This is an existing Resource"/>
<apex:selectOption itemValue="NEW" itemLabel="This is a new Resource"/>
</apex:selectRadio>
<!-- Keep form from jumping to the top after onchange -->
<apex:actionSupport event="onchange" action="{!checkoldNewRes}" reRender="newData" />
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem labelStyleClass="FRDformApplicationLabel">
<apex:selectRadio layout="lineDirection" id="radios" >
<apex:selectOption itemLabel="radio1" itemValue="radio1" />
<apex:selectOption itemLabel="radio2" itemValue="radio2"/>
<apex:selectOption itemLabel="radio3" itemValue="radio3"/>
</apex:selectRadio>
</apex:pageBlockSectionItem>
<!-- yet another attempt -->
<div id="diva">
diva here - should only be visible if radio1 was selected.
</div>
<div id="divb">
divb is here
</div>
<div id="divc">
divc
</div>
<apex:inputHidden id="ResourceOLD" value="{!tempObj.ResourceOLD__c}"/>
<apex:inputHidden id="ResourceNEW" value="{!tempObj.ResourceNEW__c}"/>
<apex:inputHidden id="NewResourceFlag" value="{!tempObj.NewResource__c}"/>
</apex:pageBlockSection>
<!-- Conditionally render one of these two sections -->
<!-- Displays fields for exiting resources -->
<apex:pageBlockSection rendered="{!IF(oldNewRes=='OLD',True,False)}" id="oldRes">
<apex:outputPanel rendered="true">
existing resource stuff here - dropdown - rendered oldRes section
</apex:outputPanel>
</apex:pageBlockSection>
<!-- Displays fields for new resources -->
<apex:pageBlockSection rendered="{!oldNewRes=='NEW'}" id="newRes">
<apex:outputPanel rendered="true">
get lots of input texts and values from various select lists.
</apex:outputPanel>
</apex:pageBlockSection>
</apex:outputPanel>
<!-- all Done! -->
</apex:pageBlockSection> <!--end of newData -->
</apex:outputPanel> <!-- end of row 1 panel -->
</apex:pageBlock> <!-- End block1 -->
<script type="text/javascript">
var j$ = jQuery.noConflict();
j$(document).ready(function() {
jQuery('[id$=diva]').hide();
jQuery('[id$=divb]').hide();
jQuery('[id$=divc]').hide();
jQuery('input:radio[name$=radios]').change(function(){
var radio_value= $(this).val();
if(radio_value=='radio1'){
jQuery('[id$=diva]').show();
jQuery('[id$=divb]').hide();
jQuery('[id$=divc]').hide();
}else if(radio_value=='radio2'){
jQuery('[id$=diva]').hide();
jQuery('[id$=divb]').show();
jQuery('[id$=divc]').hide();
}else{
jQuery('[id$=diva]').hide();
jQuery('[id$=divb]').hide();
jQuery('[id$=divc]').show();
}
});
});
</script>
<script>
function checkoldNewRes(Value) {
alert('Value passed is ' + Value);
// We get Value passed is [object HTMLInputElement]
var inputold = document.getElementById("OLD");
var inputnew = document.getElementById("NEW");
var content1 = document.getElementById("Value").innerText;
alert(content1); // nothing
alert(inputold); // nothing
alert(inputnew); // nothing
if(Value == NULL){Value = 'OLD'}
if(Value =='OLD') {
inputold.style.display='block';
inputold.required=True;
inputnew.style.display='none';
inputnew.removeattribute("required");
}else{
inputnew.style.display='block';
inputnew.required=True;
inputold.style.display='none';
inputold.removeattribute("required");
}
}
</script>
Controller:
public FRDResourceApplicationController ()
{
tempObj = new FRDResourceApplication__c();
chkBx = false;
// Preselect radio button
if(oldNewRes == NULL)
{
oldNewRes ='OLD';
}
}
public Pagereference checkoldNewRes(){
system.debug('Selected value is: ' + oldNewRes);
// NewResourceFlag is boolean in object
if(this.oldNewRes == 'old')
{
NewResourceFlag = false;
displayResourceNameInputText = false;
}
else
{
NewResourceFlag = true;
displayResourceNameInputText = true;
}
try
{
tempObj.NewResource__c=NewResourceFlag;
}
catch (DmlException ex)
{
ApexPages.addMessages(ex);
return null;
}
return null;
}