CODEWITHSUNDEEP
ag-grid
Aviram
Aviram

Reputation: 553

ag-grid disable checkbox programatically via gridOptions API

I have a column with checkboxSelection=true

Under some conditions and via the API, I would like to decide whether the checkbox is readonly, i.e., I can't check/uncheck.

Is this possible?

Upvotes: 7

Views: 27156

Answers (6)

YackY
YackY

Reputation: 73

For those still looking for an answer:

  • use isRowSelectable in gridConfig
  • set showDisabledCheckboxes: true in column defs

Upvotes: 3

wilssin88
wilssin88

Reputation: 11

isRowSelectable does not work in single selection mode. Better to disable it using css

cellClassRules: { 'checkbox-disabled': isCheckboxDisabled , }

Upvotes: 1

Jaime Oliveira
Jaime Oliveira

Reputation: 761

As per documentation, you can you isRowSelectable in your gridConfig

    isRowSelectable: function(rowNode) {
        return rowNode.data ? rowNode.data.condition: false;
    },

Upvotes: 2

rowadz
rowadz

Reputation: 361

If someone is still looking for an answer for this, I found a simple solution,

in your gridOptions add the following 

gridOptions = {
columnDefs: [
  {
    checkboxSelection: true,
    cellStyle: params => 
      params.value === 'YOUR_VALUE' ?  
          {'pointer-events': 'none'}
          : ''
   }
 ]  
};

Upvotes: 8

bensonissac
bensonissac

Reputation: 695

Instead of using checkboxSelection=true, you can try cellRenderer

  field: 'isMandatory',
  cellRenderer: (params) => {
       if (params.value) {
          return `<input type="checkbox" checked/>`;
       }
       else {
          return `<input type="checkbox" />`;
       }
 }

Upvotes: 2

Alexander Zbinden
Alexander Zbinden

Reputation: 2566

The property checkboxSelection can either be a boolean OR a function.

https://www.ag-grid.com/javascript-grid-column-properties/#gsc.tab=0

By using a function you can show or hide the checkbox row-based:

checkboxSelection = function(params) {
   // add your cancheck-logic here
   if (params.data.yourProperty) {
      return true;
   }
   return false;
}

Disabling a checkbox is not possible out of the box. One possible way is to reset the checkbox back to it's original state:

onRowSelected:(params) => {
    if(params.data.yourProperty && params.node.isSelected())
        params.node.setSelected(false);
}

Upvotes: 2

Related Questions