Question

I have a handler : onCalendarEditFunc that is ment to edit selected cell from the grid. For now I have this:

onCalendarEditFunc: function() {
        var selection = this.getView().getSelectionModel().getSelection();
        requires : [
            'Ext.grid.plugin.CellEditing',
            'Ext.grid.column.Column'
        ]



        edit = this.editing;
        console.log(this.getView().getSelectionModel().getSelection());
        edit.cancelEdit();
    //  this.store.insert(0, rec);
        edit.startEditByPosition({
            row: this.store.indexOf(selection[0]),
            column: 0
        });

    },

where row: this.store.indexOf(selection[0]), works fine and being like that I can edit the first cell from a selected row. But my row has a multiple columns, so I want to give column: a value which is the value of the selected cell.

Thanks

Leron

Answer 1

In order to detect the exact cell selected by the user (if you want to edit button functionality which make the selected cell editable as it was in my case) here is what you can do. That’s the begining of the initComponent function

initComponent: function(){

        this.editing = Ext.create('Ext.grid.plugin.CellEditing');
        Ext.apply(this, {
            title: 'Календар',
            frame: false,
            plugins : [this.editing],
            store: 'CalendarEvents',
            selModel: {
                selType: 'cellmodel'
            },

The important part here is

selModel: {
          selType: 'cellmodel'
          },

which then allows you to use the following syntaxis in the edit function:

editfunction: function() {
    var selection = this.view.getSelectionModel().getCurrentPosition();
    requires : [
        'Ext.grid.plugin.CellEditing',
        'Ext.grid.column.Column',
        'Ext.selection.CellModel'
    ]



    edit = this.editing;
    //console.log(this.view.getSelectionModel().getCurrentPosition().column);

    edit.cancelEdit();
//  this.store.insert(0, rec);
    edit.startEditByPosition({
        row: selection.row,
        column: selection.column
    });

},

And this is it, now you get the position of the selected cell and pass it so you can start editing from there or as it is in the function:

edit.startEditByPosition({
            row: selection.row,
            column: selection.column
        });