1

I am facing problem passing value between visual force component to visual force page.

<apex:page  sidebar="false" showHeader="false" standardStylesheets="false"  docType="html-5.0">

    <c:MenuComponent />  // this contain list of menu 


    <c:component1 />  // this sub page 1


     <c:component2 />  // this sub page 2

      <c:component3 />  // this sub page 3 

</apex:page>

i have requirement that when i press or select first menu in MenuComponent , Then i have render only <c:component1 />, if i select second menu in MenuComponent , Then i have render only <c:component2 />

how can achieve this one, its like passing value from component to visual force page and again visual force page to component again. Please any help .

2
  • Could you post some snippet so that we can look further?
    – Raul
    Oct 9, 2017 at 11:53
  • @RahulSharma you can take NileshBorse answer as question . same thing i wanted to .achieve.
    – NITHESH K
    Oct 9, 2017 at 12:00

1 Answer 1

0

Yes, you can do that, you can't pass value from component to page directly but using apex controller you can check and render the components according to that.

e.g: Suppose following is my menuComponent

<apex:component controller="listController">
     <apex:selectList id="complainType" value="{!selMenu}" size="1" styleClass="slds-select" label="Complain Type" onchange="callMe()">
       <apex:selectOptions value="{!Menus}" />
     </apex:selectList>

<script>
    function callMe{
        callCtrl();//this will call action function in VF page
    }
</script>
<apex:component/>

<apex:page  sidebar="false" **controller="menuController"** showHeader="false" standardStylesheets="false"  docType="html-5.0">
<apex:form id="frm">
<!--controller checkSelMenu method will be called from here-->    
        <apex:actionFunction action="{!checkSelMenu}" name="callCtrl" id="callCtrl" rerender="frm"/>

    <c:MenuComponent />  // this contain list of menu 

    <apex:outputPanel rendered="{!if(isMenuSel1,true,false)}">
        <c:component1 />  // this sub page 1
    </apex:outputPanel>

    <apex:outputPanel rendered="{!if(isMenuSel2,true,false)}">
     <c:component2 />  // this sub page 2
    </apex:outputPanel>

 <apex:outputPanel rendered="{!if(isMenuSel3,true,false)}">
     <c:component3 />  // this sub page 3 
</apex:outputPanel>
</apex:form>
</apex:page>

apex Class

public class listController{    
    public String selMenu{get;set;}
    public boolean isMenuSel1{get;set;}
    public boolean isMenuSel2{get;set;}
    public boolean isMenuSel3{get;set;}

    public listController(){
        isMenuSel1=false;
    }
    public List<SelectOption> getMenus(){    

        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('','--None--'));
        options.add(new SelectOption('Menu1','Menu 1'));
        options.add(new SelectOption('Menu2','Menu 2'));
        options.add(new SelectOption('Menu3','Menu 3'));
        options.add(new SelectOption('Menu4','Menu 4'));
        return options;
    }

    public void checkSelMenu(){
        if(selMenu == 'Menu1')
          isMenuSel1= true;
        else if(selMenu == 'Menu2')
          isMenuSel2= true;
         .....
         .....
    }
}
8
  • Defeats the purpose of using Visualforce components as it relies on having JavaScript, it would work but not the best option.
    – Raul
    Oct 9, 2017 at 11:35
  • @NileshBorse Yes , I know its easy on component, But my project is fully based on classic, no option to include lightning part here .
    – NITHESH K
    Oct 9, 2017 at 11:45
  • @RahulSharma Any alternative solution from your side ?
    – NITHESH K
    Oct 9, 2017 at 11:46
  • @NITHESHK, What nilesh mentioned, would work on classic and does not contain any lightning related functionality?
    – Raul
    Oct 9, 2017 at 12:02
  • 1
    thanks @NileshBorse Worked, Did some change based on my requirement .
    – NITHESH K
    Oct 10, 2017 at 9:57

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .