+ Start a Discussion
udayar_jayamudayar_jayam 

How to hide pageblocksection based on picklist value in visualforce page

Hi All,

   In opportunity Stage field when i select "closed won". then all the fields of closed won pageblocksection will be display in VF otherwise i select closed lost the pageblockselection will be hide. this  code is correct or wrong.im using PE

 

<apex:page standardController="Opportunity">
<script type="text/javascript">
function changetextbox()
{
var ele=document.getElementById('{!$Component.form1.block1.section1.populate}');
var opt=ele.options[ele.selectedIndex].text;
if (opt=='Closed Won')
{
var newEle=document.getElementById('{!$Component.form1.block1.section2}');
newEle.disabled=true;
}
else
{
var newEle=document.getElementById('{!$Component.form1.block1.section2}');
newEle.disabled=false;
}
}
</script>
<apex:form id="form1">
<apex:pageBlock id="block1">
<apex:outputPanel >
<apex:pageBlockSection id="section1">
<apex:inputField value="{!Opportunity.StageName}" id="populate" onchange="changetextbox();"/>
</apex:pageBlockSection>
<apex:pageblockSection id="section2>
<apex:inputField value="{!Opportunity.NextStep}" id="textpop" required="true"/>
</apex:pageblockSection>
</apex:outputPanel>
</apex:pageBlock>
</apex:form>
</apex:page>

Best Answer chosen by Admin (Salesforce Developers) 
Puja_mfsiPuja_mfsi

Hi,

Please try this

 

<apex:page standardController="Opportunity">
<apex:form id="form1">
<apex:pageBlock id="block1">
<apex:outputPanel >
<apex:pageBlockSection id="section1">
<apex:inputField value="{!Opportunity.StageName}" id="populate" >
<apex:actionSupport event="onchange" reRender="section2"/>
</apex:inputField>
</apex:pageBlockSection>

<apex:pageblockSection id="section2" >
<apex:inputField value="{!Opportunity.NextStep}" rendered="{!IF(Opportunity.StageName == 'Closed Won',false,true)}" id="textpop" />
</apex:pageblockSection>
</apex:outputPanel>
</apex:pageBlock>
</apex:form>
</apex:page>

All Answers

AmitdAmitd

Hi,

 

You need to use <apex:actionfunction> .

 

call this action in javscript and reRender pageblocksection in this actionfunction. Use a boolean variable in your controller and set its value as false. and use render attribute of your pageblocksection tag.

 

something like this

 

****VF PAGE

<script type="text/javascript">
function changetextbox()
{

act();

}

</script>

 <apex:pageBlock id="block1">

    <apex:inputField name="act" value="{!Opportunity.StageName}" id="populate" onchange="changetextbox();"/>

    <apex:actionFunction action="{!controllermethod}" reRender="block1" />

    <apex:pageBlockSection id="Section2" rendered="{!flag}>

        test data

    </apex:pageBlockSection>

 <apex:pageBlock>

 

****CONTROLLER CLASS

public boolean flag{get;set;}

flag = true; //in constructor

public void controllermethod(){

flag = false;

}

 

Hope this solution will work for you.

 

If it does then pelase mark is as solution. KUDOS(Click on the star)

 

Salesforce Developer, Salesforce Administrator

udayar_jayamudayar_jayam

thanks for reply Amit but im using "professional edition" only using visualforce page plz tell how to acheive this in VF

 

Puja_mfsiPuja_mfsi

Hi,

Please try this

 

<apex:page standardController="Opportunity">
<apex:form id="form1">
<apex:pageBlock id="block1">
<apex:outputPanel >
<apex:pageBlockSection id="section1">
<apex:inputField value="{!Opportunity.StageName}" id="populate" >
<apex:actionSupport event="onchange" reRender="section2"/>
</apex:inputField>
</apex:pageBlockSection>

<apex:pageblockSection id="section2" >
<apex:inputField value="{!Opportunity.NextStep}" rendered="{!IF(Opportunity.StageName == 'Closed Won',false,true)}" id="textpop" />
</apex:pageblockSection>
</apex:outputPanel>
</apex:pageBlock>
</apex:form>
</apex:page>

This was selected as the best answer
udayar_jayamudayar_jayam

thank very much puja