0
<apex:page standardController="Employee__c" extensions="testPage" tabStyle="Employee__c">

<apex:form id="frm1">

<div>
  <input type="radio" name="acc" checked="checked" value="Existing" onclick="pbBlockRenderJS('1');">Existing </input>



  <input type="radio" name="acc" value="NEWAcc" onclick="pbBlockRenderJS('2');">New</input>

  </div>




  <apex:pageBlock id="pb1" title="Pg Block 1" >
  <apex:pageBlockButtons >
 <apex:commandButton value="save" action="{!saving}"/>
   </apex:pageBlockButtons>

   <apex:pageBlockSection columns="1">
   <apex:inputField value="{!pme.Name}"/>
   <apex:inputField value="{!pme.Address__c}"/>
      <apex:inputField value="{!pme.Phone__c}"/>

   </apex:pageBlockSection>
  </apex:pageBlock>
<apex:outputPanel id="pnl1">

  <apex:pageBlock id="pb2" title="Pg Block 2" rendered="{!IF(mypbBlock == '2',true,false)}">
  <apex:pageBlockButtons >
 <apex:commandButton value="save" action="{!saving}"/>
  </apex:pageBlockButtons>

   <apex:pageBlockSection columns="1">
   <apex:inputField value="{!pme.Name}" />
<apex:inputField value="{!pme.Job_Title__c}"/>
   <apex:inputField value="{!pme.Salary__c}"/>

   </apex:pageBlockSection>
  </apex:pageBlock>

  </apex:outputPanel>

  <apex:actionFunction action="{!pbBlockRender}" name="pbBlockRenderJS" rerender="pb2">

        <apex:param name="firstParam" assignTo="{!mypbBlock}" value="" />

    </apex:actionFunction>

</apex:form>

</apex:page>

class

public with sharing class testPage {
public string Existing{get; set;}
public string NEWAcc{get; set;}

    public Employee__c emp{get;set;}
    public Employee__c pme{get;set;}
    public Employee__c emplist{get;set;}
    public String var {get;set;}
        public boolean editSection {get;set;}

        public testPage(ApexPages.StandardController controller) {
            Employee__c emp=new Employee__c();
            pme=(Employee__c )controller.getRecord();
            editSection =true;
            var= ApexPages.currentPage().getParameters().get('Id');
             system.debug('erecrrrtrtrt');

                system.debug('erecrrrtrtrt'+NEWAcc);
            if(var!=null){
            emplist=[select Name,Address__c,Phone__c,Job_Title__c,Salary__c  From Employee__c where id=:var];
            system.debug('id'+var);
            }
            }
        public PageReference saving(){
                        system.debug('erecrrrtrtrt'+Existing);

                system.debug('erecrrrtrtrt'+NEWAcc);
            upsert pme;
            PageReference p=new PageReference ('/'+pme.id);
            p.setRedirect(true);
            return p;
            }
    public PageReference pbBlockRender() {
    return null;
    }
    public PageReference EdittheSection (){
editSection = true;
return null;

        }

    public String mypbBlock { get; set; }
}

I have two radio buttons,by default Existing is selected so Pg Block 1 is displayed works fine but am not able to display Pg Block 2 when New radio is selected,please help me how to solve it..Iam a fresher.

  • please show the JS for the radio button onclick actions – cropredy Mar 21 '16 at 16:47
2

If you don't have a reason to go back to the server when the radio buttons are clicked, you can do all the processing at the client-side using CSS to show or hide the page block found by using getElementById. This gives a more immediate response to the user's actions:

<apex:page id="p">
<apex:form id="f">
    <div>
        <input type="radio" name="acc" value="Existing" checked="checked"
                onclick="show(true, false);">Existing</input>
        <input type="radio" name="acc" value="NEWAcc"
                onclick="show(false, true);">New</input>
    </div>
    <apex:pageBlock id="pb1" title="Pg Block 1">
    </apex:pageBlock>
    <apex:pageBlock id="pb2" title="Pg Block 2">
    </apex:pageBlock>
</apex:form>   
<script>
function show(showPb1, showPb2) {
    // Match Visualforce's prefixing pattern
    document.getElementById('p:f:pb1').style.display = showPb1 ? 'block' : 'none';
    document.getElementById('p:f:pb2').style.display = showPb2 ? 'block' : 'none';
}
show(true, false);
</script>
</apex:page>
  • Hi Sir,,I tried with your suggestion,,if i check the new radio button,it has to show only pb block2,,in our case pb block1 and pb block 2 both are displayed' – Satya Mar 22 '16 at 5:34
  • @sahi I was copying your Visualforce that did not appear to be trying to conditionally render pb block1. I've changed the code in the answer so both will be switched. – Keith C Mar 22 '16 at 8:20
1

The reason why you cannot see the Pg Block 2 is that the following expression does not evaluate to 'true' : rendered="{!IF(mypbBlock == '2',true,false)
In other words you are not setting the mypbBlock variable to 2 inside your testPage class.

  • The apex:actionFunction assignTo="{!mypbBlock}" in theory does set mypbBlock in the controller; can you explain a bit more? – Keith C Mar 21 '16 at 17:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.