How to disable PrimeFaces tree with checkbox selection mode

Question

I have a requirement to disable a PrimeFaces tree (checkbox selection mode) for some occasions. User should be able to see selected as well as un-selected checkboxes, but they need to be disabled in this occasion. Does anybody know how to do it?

I'm using PrimeFaces 4

Gourmand

If TreeTable work for you, you can have the tree, the checkbox and a better control on this thing I think - primefaces.org/showcase/ui/treeTableCheckbox.jsf - not sure if you can disable the checkbox easily, but I feel there's a good chance – Taoism

@Taoism Link leads to dead end now – Submersible

Answer 1

You can set for node userNode.setSelectable(false) and in jsf treetable add

showUnselectableCheckbox="true"

Psychotomimetic

Answer 2

I found a solution for this. But is not elegant, this can be done with css, We can add a conditional css to the tree and make it unclickable.

    .not-clickable {
    cursor: not-allowed;
    pointer-events: none;
}

Used above css style in the tree with a condition,

<p:tree id="tree" styleClass="#{not backingBean.editable?'not-clickable':''}" cache="false" value="#{backingBean.treeRoot}" var="node" selectionMode="checkbox" selection="#{backingBean.selectedValuesNodes}">

Gourmand

Answer 3

Set Node.setSelectable(false) for the nodes whose checkboxes you want disabled.

Evans

if i choose that way, primeface removes all checkboxes and shows a plain tree. i dont want to remove checkboxes, i need to show them in disabled mode. – Gourmand

Answer 4

I am using primereact and i disabled the checkbox like following. First, create a custom css:

.disabled-tree-table-checkbox .p-checkbox-box,
.disabled-tree-table-checkbox .p-checkbox-input {
     pointer-events: none;
     opacity: 0.65;
     border: none;
 }

Then, in your treeNodes, add this classname to the nodes you want to disable ,

const treeNode: TreeNode = {
  key: ...your key,
  data: {
    ...your data
  },
  children: ...your children
  className:  'disabled-tree-table-checkbox',
};

Butta

The question is about PrimeFaces, not PrimeReact. – Wakeen

Yeah, I thought it may guide some people. Sorry to bother. – Butta

I'd suggest to ask a new question about PrimeReact and answer that question. Your answer is of no help to PrimeFaces. – Wakeen