Select All and Clear All implementation in JSF

I have a data table and there are check boxes of each row and I would like to implement the Select All and Clear All links at the bottom of Data Table.

And as expected it should select all or clear all, all the checkboxes in data table.

Please let me, how to do this.

Thank You,

Can you explain at what point are you stucked?

I would like to implement, but i do not know the way, since if i use the java script, how to call the JSF component.

So, if you have implemented this, please let me know and if possible please send me sample code of jsf file.

Thanks in advance.

Do it on server side. If the user clicks "Select all", go to backing bean's listener method and set the boolean property mapped to your checkbox to "true" for all objects in collection.
Similar approach will work for uncheck option too.

Here is the client side code.

In the page bean, have a property to hold the count of rows displayed in the datatable and add inputHidden component in the form

<h:inputHidden id="countId" value="#{%pageBean%.%count%}"></h:inputHidden>

Add the below Javascript function

function selectAll(source) {
alert("Entered selectAll");

form = document.forms["%formId%"]; //replace %formId% with ur formId

var count = form["%formId%:countId"].value;

alert("count:"+count); //This gives count of rows

for(i=0; i < count; i++){
form["%formId%:%dataTableId%:" +i + ":%checkBoxId%"].checked = true;
}
}

function clearAll(source) {
alert("Entered clearAll");

form = document.forms["%formId%"]; //replace %formId% with ur formId

var count = form["%formId%:%checkBoxId%"].value; //replace %checkBoxId% with ur checkBoxId

alert("count:"+count); //This gives count of rows

for(i=0; i < count; i++){
form["%formId%:%dataTableId%:" +i + ":%checkBoxId%"].checked = false;
}
}

Thank you friend for detailed reply , I will try this. Have a nice day

Originally posted by Varun Khanna:
Do it on server side. If the user clicks "Select all", go to backing bean's listener method and set the boolean property mapped to your checkbox to "true" for all objects in collection.
Similar approach will work for uncheck option too.

I'd second that for a couple of reasons.

With JSF you need to just break down and think Server Side. Javascript is good but what happens when someone visits your site that doesn't have Javascript turned on. At the very least have it work both ways. I typically just don't bother with JS unless I have to

Page stay much cleaner if you do all the work in the backing bean.

This is not JSP/Servlet programming. This is JSF. A component oriented framework. Think components, think actions, think GUI's. Stop thinking HTML.

I agree with Greg and Varun

I�m trying the JSF approach, but the problem is that I use some of the check box components appear on other pages. So after doing a select all on one page, I go to another page, those same boxes would render as checked. They would need to be reset somehow, but I'm not sure how I would approach it. Any suggestions? Thanks!

Hi,
Every One I am New in JSF,,
I have to select all checkboxes on click of a button,,,,,,,,,,,,,,,
I am not using javascript ,,,
Please can you tell me , How Can handle this with actionListner ???
As Mr. Varun Khanna Suggest...

I have done select all checkboxes on click of a button in jsf on server side.
But o server it taking 5-6 sec...
it is taking too much time ,
i want to ask that,
What is the good way to this work.
1 . Do In server Side
2. Do in client Side..........

Suggest me.....