Question

I just started using dojo and just started to play around with it. Basically what I want do is that I have a table which has 2 columns A and B. The cells in Column B will either be locked or editable depending on the value of column A.

Is there a way to set the editable property at cell level and not on the column level as defined in the layout?

I tried using the formatter but can’t get it to work properly.

Answer 1

You can override the grid function onCellDblClick – but this is version-specific code. If the dojo.version changes in your page, the grid Event.js may have other behaviors. The following snippet is taken from … /dojox/grid/_Event.js from version 1.7.2.

If your editing is set to fire via doubleclicking a cell (default behavior), you may choose to simply ignore it with a well placed return in the following:

    var customOnEditActivate = function(e){
            // summary:
            //              Event fired when a cell is double-clicked.
            // e: Event
            //              Decorated event object contains reference to grid, cell, and rowIndex
            var event;
            if(this._click.length > 1 && has('ie')){
                    event = this._click[1];
            }else if(this._click.length > 1 && this._click[0].rowIndex != this._click[1].rowIndex){
                    event = this._click[0];
            }else{
                    event = e;
            }
////
// entrypoints of interest: event.cell & event.cellNode(.innerHTML)
// As example we could ignore editing mode if cell contains 'NON_EDITABLE'

if(cell.innerHTML.match("NON_EDITABLE"))
     return;

//
////
            this.focus.setFocusCell(event.cell, event.rowIndex);
            this.onRowClick(event);
            this.edit.setEditCell(event.cell, event.rowIndex);
            this.onRowDblClick(e);
    },

So whilst initializing your grid, set the config parameter onCellDblClick to the above function:

require(["dojox/grid/DataGrid"], function(DataGrid) {
  var grid = new DataGrid({
    onCellDblClick: customOnEditActivate
  });
});

or

<div 
      data-dojo-type="dojox.grid.DataGrid" 
      data-dojo-props="onCellDblClick: customOnEditActivate"
></div>