[SalesForce] Hide/Unhide Div on the basis of picklist selected value using javascrippt

I am trying to hide one DIV if the selected value is not 50 . On salesforce view page I have added Visual Force Page through standard layout option. I want to display that page only if selected vale of Months is not 50 . Below is the code with which I am trying to achieve this. Please note Months is the custom field on Opportunity.

Visual Force Page 

<apex:page standardController="Opportunity">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js" type="text/javascript"></script> 

<script type="text/javascript">  

 $j = jQuery.noConflict(true); 
 $j(document).ready 
(    
    function()
    {
       if(Opportunity.months__c != "(50) Fifty" && Opportunity.months__c !="" && Opportunity.months__c != null)
           {
                 $('#note').fadeIn('slow');; 
               sfdcpage.
           }
        else
            {
                $('#note').fadeOut('slow');; 
            }
    }
    )    

<div id="note" class="note">
    <div class="noteTitle">Note</div>
    <div id="noteBody" class="noteBody">
        Some Sample Text Here
    </div>
</div>
        </script>

Best Answer

You can simply achieve this through standard tags. I don't see any reason to go for JavaScript for this.

<apex:page standardController="Opportunity">

<apex:outputPanel rendered="{!Opportunity.months__c == '(50) Fifty'}">
    <apex:outputLabel>Some Sample Text Here</apex:outputLabel>
</apex:outputPanel>

</apex:page>
Related Topic