How to register onClick listener to dijit Button within GridX?

Question

I'm trying to register my onClick listener to dijit Button placed as in-cell widget withing GridX. I've done the following, basing on example test_grid_cellWidget:

{ field: "save", name:"Save", 
    widgetsInCell: true,
    navigable: true,
    decorator: function(){
        //Generate cell widget template string
        return '<button data-dojo-type="dijit.form.Button" data-dojo-attach-point="btn">Save</button>'
    },
    setCellValue: function(data){
        //"this" is the cell widget
        this.btn.set("label", "Speichern")
        this.btn.connect("onClick", function(){
            alert('clicked')
        })
    }
},

setCellValue is executed successfully, and the label is changed. However, the onClick listener is not registered and is not called, when I click on button. When I use the syntax data-dojo-props="onClick:function" it works, but it requires declaring listener function as global, which is something I'd like to avoid.

Anyway, I have the Button object, and I'm executing the code found in dijit documents, so it should be working. But why nothing is registered in that context?

Answer 1

I've found the answer in GridX wiki: https://github.com/oria/gridx/wiki/How-to-show-widgets-in-gridx-cells%3F

You need to use the field cellWidget.btn._cnnt:

    setCellValue: function(gridData, storeData, cellWidget){
        this.btn.set("label", "Speichern")
        if(cellWidget.btn._cnnt){
            // Remove previously connected events to avoid memory leak.
            cellWidget.btn._cnnt.remove();
        }
        cellWidget.btn._cnnt = dojo.connect(cellWidget.btn, 'onClick', lang.hitch(cellWidget.cell, function(){
            rowSaveClick(this.row)
        }));
    },