how to get selected records count in rich data table having multiple pages rich:datascroller

Question

I am facing a problem where i want to test that whether a user has selected any record or not from the multiple page in rich:dataTable. These pages are created through rich:datascroller. Related code is given below.

            <rich:datascroller id="dataScroller" selectedStyleClass="myClass" renderIfSinglePage="false"
                align="center" for="dataList" maxPages="10" 
                 pageIndexVar="currentPage" pagesVar="totalPages" reRender="pageNum,dataList" ajaxSingle="false">
                <f:facet name="first"><h:outputText value="First" /></f:facet>
                <f:facet name="last"><h:outputText value="Last" /></f:facet>
            </rich:datascroller>
            <h:inputHidden id="pageNum" value="#{currentPage}"></h:inputHidden> 
            <h:inputHidden id="numOfRows" value="10"></h:inputHidden>

The problem is that if user selects a record (say on 3rd page) and after that he moves to page one. Now in this case when i try to iterate through the table in Java Script to know that whether he has selected any record or not than it always allows me to iterate till the current page on which i am and hence i am unable to give user the proper alert message for selecting a record first on pressing of submit button. All i want is to know that user has checked the check box against a record on any page from the available pages , irrespective of the fact that on which page is currently opened. Any ideas?

Answer 1

Try it via the Richfaces Javascript API.

For every component you have in your page, there's a representing Javascript object, named as next: Richfaces_componentId (small 'f' for faces). Using that and to understand it live, go to the ScrollableDatatable Live Demo, open your chrome browser console, and execute this:

 Richfaces_ScrollableGrid_j_id353_carList.selectionManager.selection.ranges

This will print out an empty javascript array. Try selecting some rows, and running that line again, you'll have an array containing the indexes of your selected rows.

So to put that in a function:

<script>
    function tableHasSelection() {
         return Richfaces_ScrollableGrid_j_id353_carList.selectionManager.selection.ranges.length != 0;
    }
</script>

Now you call this function via onclick of your submit button, and return false in case of no selection to prevent submission. Of course you would replace Richfaces_ScrollableGrid_j_id353_carList with your component's javascript representing object. Hopefully this will help.

[UPDATE]

According to our discussion in the comments, here is an update that might be helpful. Your data table would be like this:

<rich:extendedDataTable value="..." var="element" id="table" selectionMode="..." selection="...">
     <rich:column>
         <h:selectBooleanCheckbox value="..." onclick="toggleSelection(this, #{element.id});" />
     </rich:column>
</rich:extendedDataTable>
<h:commandButton value="Submit" action="#{...}" onclick="return tableHasSelection();" />

And your script would have these functions:

<script>
    var selectedElements = [];
    function toggleSelection(checkbox, id) {
         if ($(checkbox).is(':checked')) {
             //add selected row if checkbox is checked
             selectedElements.push(id);
         } else {
             //or find it in the array and remove it
             var index = selectedElements.indexOf(id);
             if (index > -1) {
                 array.splice(index, 1);
             }
         }
    }

    function tableHasSelection() {
         return selectedElements.length != 0;
    }
</script>

Answer 2

(<rich:extendedDataTable> has selectable rows, you may want to look at that)

One thing you can do is to submit the selection when the user clicks it. E.g.

<h:selectBooleanCheckbox onclick="saveSelection(#{rowId})">

…
<a4j:jsFunction name="saveSelection">
    <a4j:param name="id" assignTo="#{bean.selectedId}">
</a4j:jsFunction>

But if the user will only be choosing one row then simply say if the selected row is not on the current page the user didn't select anything, I don't think that's a wrong approach.