frosty
frosty

Reputation: 5370

how to add a controller event to href in grid in extjs mvc

In my extjs grid 'cutterGrid' i have a renderer that has the following output

<a href="#" class="myclass">Product 1</a>

on my controller i have the following

    '#cutterGrid':{
        cellclick :this.onCutterSelectRow
    },

This works but, obviously this enables click on the whole row. I just want this on a particular cell.

Here is the field in my grid

 {
                            xtype:'gridcolumn',
                            dataIndex:'CutterNumber',
                            text:'Cutter',
                            renderer: renderCutter,
                            flex:1,
                            sortable: true
                        },

Upvotes: 3

Views: 1974

Answers (2)

s_hewitt
s_hewitt

Reputation: 4302

The cellclick event passes several parameters to your function - one of them is EventObject

cellclick( Ext.view.Table this, HTMLElement td, Number cellIndex, Ext.data.Model record, HTMLElement tr, Number rowIndex, Ext.EventObject e, Object eOpts )

In your function, you should be able to do this:

function onCutterSelectRow(table, td, cellIndex, record, tr, rowIndex, e, eOpts)
{
    var target = e.getTarget();
    //test HtmlElement target to be your anchor, by class name and element.
}

Upvotes: 2

sha
sha

Reputation: 17860

Problem with subscribing to the ahref events is you need to wait until HTML element is rendered and only then subscribe to it. When I had a link on my form that I need to listen to I did something like this:

{
   xtype: 'box',
   autoEl: '<a href='#'>Link</a>',
   listeners: {
      render: function(e) {
         e.getEl().down('a').on('click', function() {
            console.log('GOTCHA!');
         }, e);
      }
   }
} 

Upvotes: 1

Related Questions