function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
geo789geo789 

Highlight Row in a pageblocktable when clicking on inputcheckbox

Hi,

 

I have a pageblocktable with a column for a checkbox along with columns for data. Once the checkbox is clicked the entire row needs to be higlighted.I believe we we need to use Javascript here.Javascript along with an onselect attribute for the checkbox might be the answer.Unfortunately i have no idea in Javasript.Need help here!Thanks in advance

Developer.mikie.Apex.StudentDeveloper.mikie.Apex.Student

Do you want it to stay highlighted? Or should it swap in and out as the user clicks different checkboxes?
geo789geo789

Once the checkbox is unchecked the highligting should be removed.

Thanks
Developer.mikie.Apex.StudentDeveloper.mikie.Apex.Student

Try this:

 

Add this after your <apex:page tags :

 

<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"/>
    <apex:stylesheet value="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.css"/>

<script>
        $j = jQuery.noConflict();

        function highlightElem(elem){
            $j('tr').removeClass('ui-state-highlight');
            $j(elem).parent().addClass('ui-state-highlight');
        }
</script>

 and this to each pageblocktable tag that you want the highlighting to take effect:

 

onclick="highlightElem(this)"
geo789geo789

1)I want the code to select the entire row just by checking the checkbox. 

 

2)The code above does not remove the highlighting once the checkbox is unchecked.

 

Thanks
Developer.mikie.Apex.StudentDeveloper.mikie.Apex.Student

Changing the body of the script to this:

 

$j = jQuery.noConflict();

        function highlightElem(elem){
            $j('tr').removeClass('ui-state-highlight');
            $j(elem).addClass('ui-state-highlight');
        }

 and then the rowclick highlight tag into each collumn tag indivually may help or atleast get you close. That is pretty much the extent of my knowledge. Sorry mate.

 
geo789geo789

Well it aint working. Anways thanks for spending time for me! :)