Delete Buttton problem

[elnaz]

Hi ,

I want to delete selected row from list ,but it said :
' grid.getSelectionModel is not a function '


here is my controller code:

'relation button[action=delete]':{
        click:this.deleteList
        }

deleteList:function(button) {
          var grid = button.up('relation');
          grid.store.remove(grid.getSelectionModel().getSelection());
}

here my button code in list panel

 buttons: [
          {
          text: 'Delete',
              action: 'delete',
              scope:this,
             id: 'list-delete'
          
              }]

and here my list inside of tab panel:

 items: [{
        title: 'Author',
    xtype: 'container',
           items:[{
        align:'center',
        xtype:'gridpanel',
            store: 'StoreAuthor',
       selType: 'checkboxmodel',
            columns: [
            {header:'Method',dataIndex:'method', flex: 1,align:'center'},
            {header:'Information',dataIndex:'Info', flex: 1,align:'center'},
            
        ]
    }]

    },{
        title: 'Activite',
    xtype: 'container',
           items:[{
        align:'center',
        xtype:'gridpanel',
            store: 'StoreAuthor',
        selType: 'checkboxmodel',
               columns: [
            {header:'Method',dataIndex:'method', flex: 1,align:'center'},
            {header:'Information',dataIndex:'Info', flex: 1,align:'center'},
            
        ]
    }]
    },{
        title: 'Relations',
    xtype: 'container',
           items:[{
        align:'center',
        xtype:'gridpanel',
            store: 'StoreAuthor',
        selType: 'checkboxmodel',
               columns: [
            {header:'Method',dataIndex:'method', flex: 1,align:'center'},
            {header:' Information',dataIndex:'Info', flex: 1,align:'center'},
            
        ]
    }]
    }

is any one knows what is the problem ?

[momesana]

Hi Elnaaz,
Without (thoroughly) reading the code I would advise you to check if the parent of the button really is the grid. Basically what you should do is, set a break point (using a proper debugger like the one shipped with chrome [chrome developer tools] or firebug) inside the function after the "var grid ..." line is executed and check to see what the element is. You could use grid.getXtype() in the console when you are inside the function or use "Watched expressions" for that. Hope that helps ya!

Cheers
Mehdi

[elnaz]

Thanks,

but my panel is extend: 'Ext.tab.Panel',
and then inside of tab I have container and gridlist



is it the problem?

[momesana]

I don't fully comprehend what your code is supposed to do. You have a line where a button is used to traverse up it's ancestors until it finds a component that matches the selector 'relation' and then assumes that this is a grid. Check it in the debugger. You could workaround this issue using an id on the grid and then getting the component like so:

var grid = Ext.getCmp('yourId');

or by using the ComponentQuery:

var grid = Ext.ComponentQuery.query('... componentQuery selector ...');

Again: Check it in the debugger. Once you are at the breakpoint you can type all the stuff into the console and validate them without the need for guessing and going through the regular edit > save > reload cycle.

Cheers
Mehdi

[elnaz]

thanks ,

but it doesn't work yet

I have another panel that call my tab panel there
as you said I think I should use query but I don't know how

I use debugger also but I 'm relay new to extjs couldn't find the error yet

  extend: 'Ext.panel.Panel',     alias:'widget.vPanel',     width: '100%',     height: '100%',          layout: {                                 type: 'vbox',         align: 'center'     },      items: [{                                 xtype: 'detailPanel',     id: 'detail-panel',      maxHeight:280,         width: '100%',         flex: 4                        },{     xtype: 'relation',     id: 'relations-panel',         width: '100%',              flex: 1      }] });

[elnaz]

It's work thanks Mehdi

I just using query("gridpanel")[0];

var grid = button.up('relation').query("gridpanel")[0];
          grid.store.remove(grid.getSelectionModel().getSelection());