Apex Component rendering pageblock on other component

Question

Can we have one component have pageblock section on other component to be rendered

ie. for eg. i have 2 components in a page..

1st with all links -- Account,Contact 2nd with all page block section -- Account section, contact section

If user clicks on Account link ... only account section from 2nd component should be rendered If user clicks on Contact link ... only account section from 2nd component should be rendered

This is what i have tried so far

Component code:-

<apex:component ><apex:commandLink value="" reRender="opCustomerDetails">CUSTOMER DETAILS</apex:commandLink><br/><apex:commandLink value="" reRender="opContactDetails">CONTACT DETAILS</apex:commandLink><br/></apex:component>

Page code:-

<apex:page extensions="TestPageClass" standardController="Application__c" ><table width="100%" class="mainContentTable"><tr><td width="50%" ><c:OAOASubmissionForms /></td><td width="50%" ><apex:outputPanel id="opCustomerDetails"><apex:pageBlock id="pbCustomerDetails"><apex:outputLabel value="Legal Name of Customer(in English)" /><apex:inputField value="{!account.Name}"/></apex:pageBlock></apex:outputPanel><apex:outputPanel id="opContactDetails">
<apex:pageBlock id="pbContactdetails">
<apex:pageBlockSection columns="1" id="pbAddr1" title="Address1">
    <apex:inputField value="{!applicationaddress1.Contact_Person__c}"/>
    <apex:inputField value="{!applicationaddress1.Contact_Person_Title__c}"/>
    <apex:inputField value="{!applicationaddress1.Address__c}"/>
</apex:pageBlockSection>
<apex:pageBlockSection columns="1" id="pbAddr2" title="Address2">
    <apex:inputField value="{!applicationaddress2.Contact_Person__c}"/>
    <apex:inputField value="{!applicationaddress2.Contact_Person_Title__c}"/>
    <apex:inputField value="{!applicationaddress2.Address__c}"/>
</apex:pageBlockSection>
</apex:pageBlock></apex:outputPanel></td></tr></table></apex:page>

TestPageclass Code

public with sharing class TestPageClass{
public string applicationId {get;set;}

public Account account{get;set;}
public Application__c application{get; set;}
public Application_Address__c applicationaddress1{get;set;}
public Application_Address__c applicationaddress2{get;set;}


public TestPageClass(ApexPages.StandardController stdCtrl) 
{
    this.application=(Application__c)stdCtrl.getRecord();

    account=[   SELECT Id,Name                            
                FROM Account                             
                WHERE Id= '01Ii0000000tP5Y'];
    if(application != null && application.Id != null)
    {        
        this.application = [SELECT Id, Name, Accept_T_C__c
                    FROM Application__c
                    WHERE Id = : application.Id];

        this.applicationaddress1 =[SELECT Type__c, Name, Contact_Person__c, Contact_Person_Title__c,Application__c, Address__c 
                                    From Application_Address__c
                                    WHERE Application__c = : this.application.id
                                    AND Type__c = 'Address1' LIMIT 1]; 

        this.applicationaddress2 =[SELECT Type__c, Name, Contact_Person__c, Contact_Person_Title__c,Application__c, Address__c 
                                    From Application_Address__c
                                    WHERE Application__c = : this.application.id
                                    AND Type__c = 'Address2' LIMIT 1];
    }
}

}

I want to show the customer output panel when customer Details in component is clicked. Over here i have just used 1 component and rest all details are in the page.

Answer 1

I am not quite sure about your requirement but you can do this by <apex:commandlink>

e.g:

    <apex:commandlink value="Render Account Section" rerender="accountSectionId" action="{!doSomething}"/>
    <apex:commandlink value="Render contact Section" rerender="contactSectionId" action="{!doSomething}"/>

<!-- component -->
    <apex:pageblock>
      <apex:outputPanel id="accountSectionId">

         <!-- Account components -->

      </apex:outputpanel>

      <apex:outputPanel id="contactSectionId">

        <!-- contact components -->

      </apex:outputpanel>
    </apex:pageblock>