function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Dhananjaya BulugahamulleDhananjaya Bulugahamulle 

Why my code is not working?

VF page 
<apex:form id="theForm">
<apex:pageBlock id="thePageBlock">
 <apex:inputField value="{!Product_Brief__c.Product_Format__c}" onchange="myPicklistChanged();" id="myPicklist"/>

<table id="table_section4" align="center">
                <tr>
                    <th>QUANTITY</th>
                    <th>UNIT SIZE FILL VOLUME</th> 
                    <th class="Hidecolumn">LIQUID PACKAGING</th>
                    <th>POWDER AGT PACKAGING</th>
                    <th>TOTAL VOLUME:</th>
                </tr>
                <tr>
                    <td><apex:inputField value="{!Product_Brief__c.Quantity1_1__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Unit_Size_Fill_Volume1_1__c}"/></td> 
                    <td class="Hidecolumn"><apex:inputField value="{!Product_Brief__c.Liquid_Packaging1_1__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Powder_AGT_Packaging1_1__c}" /></td>
                    <td><apex:inputField value="{!Product_Brief__c.Total_Volume1_1__c}"/></td> 
                </tr>
                <tr>
                    <td><apex:inputField value="{!Product_Brief__c.Quantity1_2__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Unit_Size_Fill_Volume1_2__c}"/></td> 
                    <td class="Hidecolumn"><apex:inputField value="{!Product_Brief__c.Liquid_Packaging1_2__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Powder_AGT_Packaging1_2__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Total_Volume1_2__c}"/></td>
                </tr>
                <tr>
                    <td><apex:inputField value="{!Product_Brief__c.Quantity1_3__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Unit_Size_Fill_Volume1_3__c}"/></td> 
                    <td class="Hidecolumn"><apex:inputField value="{!Product_Brief__c.Liquid_Packaging1_3__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Powder_AGT_Packaging1_3__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Total_Volume1_3__c}"/></td>
                </tr>
                <tr>
                    <td><apex:inputField value="{!Product_Brief__c.Quantity1_4__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Unit_Size_Fill_Volume1_4__c}"/></td> 
                    <td class="Hidecolumn"><apex:inputField value="{!Product_Brief__c.Liquid_Packaging1_4__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Powder_AGT_Packaging1_4__c}"/></td>
                    <td><apex:inputField value="{!Product_Brief__c.Total_Volume1_4__c}"/></td>
                </tr>
     <apex:pageBlock >
</apex:form>

JavaScript 

function myPicklistChanged(){
        var myPicklistElement = document.getElementById('{!$Component.theForm.thePageBlock.thePageBlockSection.myPicklist}');
        var myPicklistValue = myPicklistElement.options[myPicklistElement.selectedIndex].value;

        if (myPicklistValue == 'Biochemical Repack' || myPicklistValue == 'AO Powder' || myPicklistValue == 'AGT™ (Advanced Granulation)'  ){
            document.getElementByClassName("Hidecolumn").style.visibility = "hidden";
            
            }
        }

When User Select those value from pic list I want to hide the rows (Class = HideColumn). but it wont work. any body have any idea why? 
William TranWilliam Tran
Try putting your javascript function in a <Script>  ....</Script> tag.

Thx
Dhananjaya BulugahamulleDhananjaya Bulugahamulle
I did. Still not working. When I use Id it works, but I do not want to use Id for every single raw. That is lots of codes. That’s why I used a class method. But it is not working 
William TranWilliam Tran
One step at a time :-)

getElementsByClassName returns a collection. You can't collectively set properties unless you're using a framwork like jquery

But you can do this:

var elems = document.getElementsByClassName('Hidecolumn');
for(var i = 0; i != elems.length; ++i) { elems[i].style.visibility = "hidden"; }

Thx
 
Dhananjaya BulugahamulleDhananjaya Bulugahamulle
Thanks William, But it still not working.  I have no idea why. Thank you very much for your help.