Question

As you understand from the title above, I have a datatable and checkboxes in each row.

I want to enable a button when at least one checkbox is selected, and disable it when there is no selected checkboxes (I mean all of them is unselected). I could achieve this as like if one of the checkboxes is selected, the button becomes enable. However, the reversable case I have to do is when the checkboxes is being unselected, when the last selected checbox becomes unselected, the button immediately must become disabled…

BTW, I must do it without using a setter method nor a backing bean.
Can I perform it by using jquery or a jsfunction, richfaces, etc?

As a result, I want to learn how I can disable a button at the moment when all of the checkboxes are unselected?

In order to clarify the case, here is my code below;

<h:selectBooleanCheckbox id="selectionCheck" 
    onclick="document.getElementById('form1:button1').disabled=false" 
    value="#{_apiV2Product.selectValue}" > 
</h:selectBooleanCheckbox>

Any help would be appreciated,
Many thanks,
Baris

Answer 1

You can do this with following jQuery snippet:

$('[id$=selectionCheck]').click(function() {
    $('[id$=button1]').attr('disabled', $('[id$=selectionCheck]:checked').length == 0);
});

This assigns an onclick function to every checkbox which disables the button when no one checkbox is checked.

The [id$=xxx] selector selects elements with a client ID ending with the given value. This may be useful in JSF/RichFaces since it prepends the client ID’s with the ID(s) of parent UINamingContainer components (e.g. h:form, h:dataTable, f:subview and so on).