動態控制dojo DataGrid列的編輯模式

Question

我剛開始使用dojo，剛開始玩弄它。基本上我想要做的是我有一個表有2列A和B.列B中的單元格將根據列A的值鎖定或可編輯。

有沒有辦法設置可編輯屬性在單元級而不是在佈局中定義的列級別？

我嘗試使用格式化程序，但無法使其正常工作。

Answer 1

您可以覆蓋網格功能onCellDblClick - 但這是特定於版本的代碼。如果dojo.version在您的頁面中發生變化，則網格Event.js可能會有其他行爲。以下片段摘自... /dojox/grid/_Event.js版本1.7.2。

如果您編輯設置通過雙擊單元格（默認行爲）解僱，你可以選擇簡單地用下面的有利地位return忽略它：

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); 
    }, 

因此，雖然初始化網格設置的配置參數onCellDblClick上述功能：

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

或

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

Answer 2

你可以重寫DataGrid的

canEdit: function(inCell, inRowIndex)

方法。從這一點，你可以得到的項目：

this.getItem(inRowIndex)

然後制定出它是否應該爲可編輯與否，並返回真/假。

Answer 3

我得到了以下的工作（類似埃德Jellard的建議）：

<script type="dojo/require"> 
    jsonRestStore : "dojox/data/JsonRestStore", 
    contentPane : "dijit/layout/ContentPane", 
    dataGrid  : "dojox/grid/DataGrid" 
</script> 

<div dojoType="dijit.layout.ContentPane"> 
    <script type="dojo/method"> 
     configStore = new dojox.data.JsonRestStore 
     ({ target : "/data/config", 
      idAttribute : "propertyName" }); 

     configStructure = 
      [ {field:'propertyName', name:'Property - Name', 
       width:20}, 
      {field:'value', name:'Value', 
       editable:true}, 
      {field:'guiConfigurable', name:'Property Type'}, 
      {field:'description', name:'Description'} 
      ]; 
    </script> 
</div> 

<table data-dojo-type="dojox.grid.DataGrid" 
     store="configStore" 
     structure=configStructure> 
    <script type="dojo/method" event="canSort" args="sortInfo"> 
     return false; 
    </script> 
    <script type="dojo/method" event="onApplyCellEdit" > 
     configStore.save(); 
    </script> 
    <script type="dojo/method" event="canEdit" args="inCell, inRowIndex"> 
     var gc = this.getItem(inRowIndex).guiConfigurable; 
     return gc == 'W' || gc == 'D'; 
    </script> 
    <tbody/> 
</table>