Set checkbox as read-only using Primefaces

Question

I am currently using a <p:selectBooleanCheckbox /> and I was wondering if there is a way to make it read only.

Basically, I would like you to be able to make it open up a sublist of check boxes and the original checkbox would only show the checkmark if any of the other checkboxes are checked.

Any ideas on how to do this?

Answer 1

<p:selectBooleanCheckbox value="#{formBean.value1}" disabled="true"/>

This will disable the element. I used to change CSS by primeface skinning if required.

Bind the property with some Boolean variable in manage bean. Refresh/ Reload the component on completion of the event [ according to the requirement ] that is changing the Boolean variable.

Answer 2

Setting

disabled="true"

solves the issue, that this checkbox cannot be edited anymore, but it is very pale, and it's look-and feel don't conform page style. I used the following trick to make this like an ordinary (not disabled) component:

$(document).ready(function(){
  $('.ui-chkbox div').removeClass('ui-state-disabled');
});

This removes "disabled" style from all primefaces checkboxes on the page. You can easily adjust it only to the components you need.

Answer 3

This one works for me, and it's look-and feel is ok:

<p:selectBooleanCheckbox value="#{beanc.value}" onchange="return false;"/>

Answer 4

This is not possible by default. You can disable the checkbox and use css as follows:

<p:selectBooleanCheckbox value="#{bean.value}" disabled="true" styleClass="readonly" />

And the following css so that the box does not appear disabled.

.ui-selectbooleancheckbox.readonly .ui-chkbox-box.ui-state-disabled
{
 opacity: 1;
}