How to disable entire column in ag-grid

Question

I want to disable entire column based on specific condition that column contains onCellClicked event but i don't want it to fire

Answer 1

Using gridOptions.isRowSelectable we can set a particular row to be selectable or not selectable. Below is an example from the ag-grid documentation itself. gridOptions.isRowSelectable: function(rowNode) { return rowNode.data ? rowNode.data.year < 2007 : false; }

Answer 2

You have to define editable property in colDef

editable: false <-- edit would be disabled for needed column

Updated

Header checkbox can be used for row-selection, for other things, you should create custom handlers by yourself.

For display handling, you need to create cellRenderer

For edit handling, you need to create own cellEditor

Based on the official demo:

Here is worked sample for your case DEMO

cellRenderer - checkbox would be displayed as an icon

import {Component} from "@angular/core";
import {ICellRendererAngularComp} from "ag-grid-angular";

@Component({
    selector: '',
    template: `
    <div class="checkbox-container">
        <span *ngIf="params.value == true" title='true' class='ag-icon ag-icon-tick content-icon'></span>
        <span *ngIf="params.value == false" title='false' class='ag-icon ag-icon-cross content-icon'></span>
        <span *ngIf="!params.value"></span>
    </div>
    `
})
export class CheckboxRendererComponent implements ICellRendererAngularComp {
    private params: any;

    agInit(params: any): void {
        this.params = params;
    }

    refresh(params):boolean{
      return true;
    }
}

cellEditor - double click on the cell will provide edit mode (if its possible, based on colDef- editable property)

import {Component} from "@angular/core";
import {ICellEditorAngularComp} from "ag-grid-angular";

@Component({
    selector: '',
    template: `<input type="checkbox"  [(ngModel)]="checkboxValue">`,
})

export class ChekboxEditorComponent implements ICellEditorAngularComp {

    private params: any;
    private checkboxValue:boolean;


    agInit(params: any): void {
        this.params = params;
        this.checkboxValue = this.params.value;
    }

    refresh(params):boolean{
      return true;
    }

    getValue(){
      return this.checkboxValue;
    }
}

And the last thing: editable: (params)=>{return params.node.data.checkbox != true}

here there is a logic which will disable edit mode for true values in column