1. #1
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default Answered: How to pass record (selected with right click) to a menu item in context menu?

    Answered: How to pass record (selected with right click) to a menu item in context menu?


    I have a grid with context menu.

    I need to pass the current selected record (the record at which the context menu has been invoked using mosue right click) to handler of a menu item.

    Following is a sample code I am using:

    Code:
    Ext.onReady(function () {
        
        //Defining the action for context menu to which record has to be passed
        var editAction    =    Ext.create('Ext.Action', {
            text: 'Edit this record',
            handler: function() {
                console.log('in handler'+selRecord);//This is undefined as selRecord is not in the scope
                var rec2    =    grid.getSelectionModel().getSelection()[0];//This gives the record selected with left click
            }
        });
        
        //Defining the context menu
        var contextMenu = Ext.create('Ext.menu.Menu', {
            items: [
                editAction
            ]
        });
        
        //Sample data for the grid
        var myData = [
            ['3m Co', 71.72, 0.02, 0.03, '9/1 12:00am'],
            ['Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am'],
            ['Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am'],
            ['American Express Company', 52.55, 0.01, 0.02, '9/1 12:00am'],
            ['American International Group, Inc.', 64.13, 0.31, 0.49, '9/1 12:00am'],
            ['AT&T Inc.', 31.61, -0.48, -1.54, '9/1 12:00am'],
            ['Boeing Co.', 75.43, 0.53, 0.71, '9/1 12:00am'],
            ['Caterpillar Inc.', 67.27, 0.92, 1.39, '9/1 12:00am']
        ];
    
    
        // Data store
        var store = Ext.create('Ext.data.ArrayStore', {
            fields: [{
                name: 'company'
            }, {
                name: 'price',
                type: 'float'
            }, {
                name: 'change',
                type: 'float'
            }, {
                name: 'pctChange',
                type: 'float'
            }, {
                name: 'lastChange',
                type: 'date',
                dateFormat: 'n/j h:ia'
            }],
            data: myData
        });
    
    
        //Grid
        var grid = Ext.create('Ext.grid.Panel', {
            store: store,
            columnLines: true,
            columns: [{
                text: 'Company',
                //locked   : true,
                width: 200,
                sortable: true,
                dataIndex: 'company',
                locked: true
            }, {
                text: 'Price',
                width: 125,
                sortable: true,
                renderer: 'usMoney',
                dataIndex: 'price'
            }, {
                text: 'Change',
                width: 125,
                sortable: true,
                dataIndex: 'change'
            }, {
                text: '% Change',
                width: 125,
                sortable: true,
                dataIndex: 'pctChange'
            }, {
                text: 'Last Updated',
                width: 135,
                sortable: true,
                renderer: Ext.util.Format.dateRenderer('m/d/Y'),
                dataIndex: 'lastChange'
            }],
            height: 350,
            width: 600,
            title: 'Grid Context Menu',
            renderTo: Ext.getBody(),
            viewConfig: {
                stripeRows: true,
                listeners: {
                   
                    itemcontextmenu: function(view, selRecord, node, index, e) {
                        console.log('in listener '+selRecord);//This gives the record selected with right click
                        e.stopEvent();
                        contextMenu.showAt(e.getXY());
                        return false;
                    }
    
                }
            }
        });
    });
    If we use grid.getSelectionModel().getSelection()[0] then this gives the record selected with left mouse click and not the one at which contextmenu has been invoked.

    Thus, how could such a record be accessed in the handler?

    Could anyone guide at this?

    Thanks in advance.

    PS: I am using ExtJS 4.0.7

  2. I have been able to locate a workaround for this.

    I am forcefully making the record at which the context menu has been invoked as also the selected record for the grid. I am writing the following line in the itemcontextmenu:

    Code:
    grid.getSelectionModel().select(selRecord);
    This sets the record at which the context menu has been invoked as also the currently selected record. And then this records can be accessed from the handler using:


    Code:
    grid.getSelectionModel().getSelection()[0];
    Hope this helps someone looking for the same.

  3. #2
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default Found a workaround

    Found a workaround


    I have been able to locate a workaround for this.

    I am forcefully making the record at which the context menu has been invoked as also the selected record for the grid. I am writing the following line in the itemcontextmenu:

    Code:
    grid.getSelectionModel().select(selRecord);
    This sets the record at which the context menu has been invoked as also the currently selected record. And then this records can be accessed from the handler using:


    Code:
    grid.getSelectionModel().getSelection()[0];
    Hope this helps someone looking for the same.

  4. #3
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default Should this not be default behaviour?

    Should this not be default behaviour?


    Though, I have currently implemented a work around for making the record at which the context menu is invoked as also the selected record in the grid.

    But I was just wondering that should this not be a default behavior? That is, whenever a user right clicks a record to invoke context menu, then that record also becomes the currently selected record of that grid. As otherwise, there are two records which are displayed as highlighted.

    Any thoughts on this anyone?

    TIA.

  5. #4
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    247
    Answers
    44
    Vote Rating
    41
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    PHP Code:
      var editAction    =    Ext.create('Ext.Action', {
            
    text'Edit this record',
            
    handler: function() {
                 
    console.log('Action on %o record'this.record); 
            }
        }); 
    PHP Code:
    itemcontextmenu: function(viewselRecordnodeindexe) {
                        
    console.log('in listener '+selRecord);//This gives the record selected with right click
                        
    e.stopEvent();
                        
    editAction.record selRecord// Save reference to selRecord
                        
    contextMenu.showAt(e.getXY());
                        return 
    false;
                    } 

  6. #5
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default


    Thanks for the post Redraid.

    The issue related to using
    Code:
    editAction.record = selRecord;
    is that if I have ten or may be more menu items in my context menu then I shall have to write this separately for every one.

    Instead of this, I shall prefer the same method of setting the current record as also the selected one using select method of selectionModel.

    But I still feel that this behavior should be default, so that when user invokes the context menu at a record, then that record also becomes the currently selected one, as otherwise, user also gets to see two records highlighted.

  7. #6
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    247
    Answers
    44
    Vote Rating
    41
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    Quote Originally Posted by netemp View Post
    t if I have ten or may be more menu items in my context menu then I shall have to write this separately for every one.
    you can save reference to grid:
    PHP Code:
     grid.contextMenuRecord selRecord// Save reference to selRecord 
    and then use this reference:
    PHP Code:
    console.log('Context menu record %o'grid.contextMenuRecord); 

  8. #7
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default


    Great, this is good option. But do you find any issue in setting the same record as selected one too?

    Also, would this not be confusing for the user if he finds that right-clicking a record is not setting it as the selected record and there are two records which user can see as highlighted one?

  9. #8
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    247
    Answers
    44
    Vote Rating
    41
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    IMHO right click with context menu must select record

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar