+ Start a Discussion
pupilstuffpupilstuff 

Color of row of pageblock table is not changing

Hello ,

 

My req is: When I click on the row the color of the row should change from yellow to any other.I am using java script for this.When I click on the row alert generates but color doesnt change .Please help

 

<apex:page controller="LogClassificationVFC">
<apex:sectionHeader title="Mapping of Error"/>
    <apex:form id="form1" >
        <apex:pageBlock id="pBlock" title="Mapping" mode="edit">
            <apex:panelGrid columns="2" id="panel">
                <apex:outputPanel id="op1" styleClass="requiredInput" layout="block">          
                    <apex:pageBlockSection >                  
                    <apex:outputlabel value="Catagory "/>
                    <apex:selectList value="{!rootErrorStr}"  multiselect="false" size="1">
                        <apex:selectOptions value="{!rootErrorList}" />
                            <apex:actionSupport action="{!showAllRecord}" event="onchange"  rerender="panel" status="status"/>
                        </apex:selectList><p/>
                                </apex:pageBlockSection>
                </apex:outputPanel>

                <apex:pageBlockTable rendered="{!addErrorFlag}" value="{!showRecList}" var="showRec">
                    <apex:column value="{!showRec}" />
                </apex:pageBlockTable>
 
                <apex:pageBlockTable id="pbTable" rendered="{!addErrorFlag}" value="{!showRecRelNewErrSet}" var="showAllRec" onrowClick="show('{!$Component.this}');">
                    <apex:column value="{!showAllRec}" style="background-color:yellow"/>  
                </apex:pageBlockTable>
                <script> var options = document.getElementById("{!$Component.pbTable}"); </script>
                <apex:pageBlockSection id="addError" rendered="{!addErrorFlag}" > 
                    <apex:outputLabel value="Select Error"/>
                    <apex:selectList value="{!addErrorStr}"  multiselect="false" size="1">
                        <apex:selectOptions value="{!rootErrorList}" />
                    </apex:selectList><p/>
                </apex:pageBlockSection>

            </apex:panelGrid>
         
            <apex:pageBlockButtons location="both">
               <apex:commandButton value="Add Error" action="{!addError}"/>
               <apex:commandButton value="Delete Error" action="{!deleteError}"/>
            </apex:pageBlockButtons>
        </apex:pageBlock>
        <apex:pageMessages /> 
    </apex:form>
    <style>

    .selectedDataRow {
        background-color:#80BFFF;
    }


    </style>
    <script>
    
        function show(rowVar){ 
              alert('working');
               rowVar.className = "selectedDataRow";
          }

</script>

</apex:page>