Question

我刚刚开始使用dojo，并开始玩它。基本上我想做的是我有一个表有2列A和B列.B列中的单元格将被锁定或可编辑，具体取决于A列的值。

有没有办法在单元格级别设置可编辑属性，而不是在布局中定义的列级别？

我尝试使用格式化程序，但无法使其正常工作。

Answer 1

您可以覆盖网格函数onCellDblClick - 但这是特定于版本的代码。如果dojo.version在您的页面中发生更改，则网格Event.js可能具有其他行为。以下代码段取自版本 1.7.2 中的 ... /dojox/grid/_Event.js 。

如果通过双击单元格（默认行为）将您的编辑设置为触发，您可以选择在以下位置放置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);
    },

因此，在初始化网格时，将config参数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

您可以覆盖

canEdit: function(inCell, inRowIndex)

DataGrid的方法。从那里，您可以获得该项目：

this.getItem(inRowIndex)

然后确定它是否应该可编辑，并返回true / false。

Answer 3

我得到了以下工作（类似于Ed 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>

动态控制dojo DataGrid列的编辑模式

3 个答案: