DataGrid中的Button的onClick事件

时间:2012-06-20 21:45:32

标签: javascript dojo dojox.grid.datagrid

这是我的DataGrid:

// $ is a reference to `this` as it lies in an anonymous function
$.grid = new DataGrid({
    store : $.dataStore,
    query : {id : "*"},
    structure : [
        { 
            noscroll : true,
            cells : [{ name : "Recipe", field : 'name', width : '200px' }],
        },
        {
            cells : [
                [
                 { name : 'ID#', field : 'id', width : '50px'},
                 { name : 'Category', field : 'category', width : '100px'},
                 { name : 'Status', field : 'status', width : '100px'},
                 { name: "Actions", width : '200px', type: dojox.grid.cells._Widget, formatter : $._actionButtons}
                ]
            ] // end cells
        }
    ]
}, $.targetNode)
$.grid.startup();

$.grid.on("RowClick", function(e){
    console.log(this.getItem(e.rowIndex))
})

我的formatter动作单元格对象:

_actionButtons : function(){
    var _self = this;
    var _args = arguments;
    this.group = new Pane()

    var full = new Button({ 
        label: 'View Full',
        style : { fontSize : '80%'},
        onClick : function(){
            try {
                _self.grid.onRowClick.apply(this, arguments)
            }catch(e){}
        }
    });
    full._destroyOnRemove = true;

    var edit = new Button({
        label : 'Edit',
        style : {fontSize: '80%'}
    });
    edit._destroyOnRemove = true;

    construct.place(full.domNode, this.group.containerNode)
    construct.place(edit.domNode, this.group.containerNode)

    return this.group;
}

我正在尝试访问将由DataGrid上的普通onRowClick事件传递的事件对象。现在这种情况有用,但在on("RowClick"...)块上我得到了多个日志。如果没有try...catch块,我会收到错误,因为e中不存在rowIndex,而是存在2个日志。

这是我已经包含pub / sub,emit()等的第4个左右的想法。我感觉多个日志是由冒泡行为引起的(Button - > Row - > DataGrid或者某些人,但是让onRowClick的事件对象传递到格式化程序中创建的按钮似乎是不可能的。

我只想从Button小部件的onClick事件中访问rowIndex(以及其他DataGrid-esque属性),以便根据按下的按钮进行处理。

1 个答案:

答案 0 :(得分:0)

沿着同样的路线,但这就是我提出的那个似乎正朝着我想象的方向发展的方向。按钮所在的调整单元格:

{ name: "Actions", width : '200px', type: dojox.grid.cells._Widget, formatter : 
    function(){
        return $._actionButtons.call($, arguments);
    }
}

在返回的Button小部件中调整了onClick函数:

_actionButtons : function(){
    var _index = arguments[0][1],
        _item  = this.grid.getItem(_index)
        _self  = this;

    // some code removed

    onClick : function(){
        console.log(_self.dataStore.getValue(_item, 'name'), "clicked")
    }
}

我可能会最终扩展Button以更好地处理这个问题,但是现在,瞧!

有时它只是有助于将其写下来并将其放在那里让你的大脑恐慌并在其他人做之前找出解决方案:)

次要更新...

DataGrid有formatterScope参数,但它适用于所有formatter,因此会搞乱任何需要单元格范围而不是DataGrid范围的内容。上面的方法允许我访问我需要的一切。