Sumon Bappi
Sumon Bappi

Reputation: 2019

get value from accordion and grid in extjs 4

I want to make a pdf report against the parameter of my grid value. I want to get the year from the accordion title as parameter number 1 and month name as parameter number 2. But I am not being able to do it. Can anyone please help me on this. Here is my code below :

Ext.define('Ext4Example.view.attendence.Timeperiod' ,{
    extend: 'Ext.form.Panel',
    alias : 'widget.timeperiod',
    id: 'timeperiod',
    region: 'west',
    border: true,
    width: 150,
    height:395,
    split: true,
    defaults: {
        // applied to each contained panel
        //bodyStyle: 'padding:15px'
    },
    layout: {
        // layout-specific configs go here
        type: 'accordion',
        titleCollapse: true,
        animate: true,
        activeOnTop: true,
        hideCollapseTool : true

    },

    initComponent: function() {
        var me = this;
        me.items = me.maccord();
        me.callParent(arguments);
    },
    mstore: function(year){
        var data = [
            [1,  year, 'January'  ],
            [2,  year, 'February' ],
            [3,  year, 'March'    ],
            [4,  year, 'April'    ],
            [5,  year, 'May'      ],
            [6,  year, 'June'     ],
            [7,  year, 'July'     ], 
            [8,  year, 'August'   ], 
            [9,  year, 'September'], 
            [10, year, 'October'  ], 
            [11, year, 'November' ], 
            [12, year, 'December' ]
        ];

        var store = Ext.create('Ext.data.ArrayStore', {
            storeId: 'mstore',
            fields: [              
                {name: 'id', type: 'int'},
                {name: 'year', type: 'int'},
                {name: 'month', type: 'string'}
            ],
            data:data
        });
        return store;
    },
    mpanel: function(year){
        var me = this,
        mpanel = new Ext.grid.Panel({
            border: false,
            viewConfig: {
                stripeRows: true
            },
            hideHeaders: true,
            columns: [
                { text: 'month',  dataIndex: 'month', flex: 1},
                { menuDisabled    : true,
                    sortable        : false,
                    xtype           : 'actioncolumn',
                    width           : 24,
                    items           : [{
                            icon        : "${resource(dir: 'images', file: 'PDF01001.png')}",
                            hide        : true,
                            tooltip     : 'Print PDF Report of this Month?',
                            handler     : function(record) {
                                          alert(record.data.month)
                            }
                        }]
                }
            ],
            listeners:{
                selectionchange:function(model, records ) {
                    var store = Ext.data.StoreManager.lookup('Attendences');
                    var record = records[0];
                    store.load({
                        filters: [
                            {property:'month', value:record.data.id},
                            {property:'year', value:record.data.year}
                        ]          
                    });                    
                }
            },
            store: me.mstore(year),
            width: 150
        });
        return mpanel;
    },
    maccord: function(){          
        var year = ${(new Date()).format('yyyy')},
        limit = year - 5,
        me = this,
        maccord = [];

        for(year; year > limit ; year--){
            maccord.push({
                title: 'Year '+ year,
                ident: 'accordion-panel',
                items: me.mpanel(year)              
            });
        }
        return maccord;
    }
});

Upvotes: 3

Views: 843

Answers (1)

Darin Kolev
Darin Kolev

Reputation: 3411

The month and the year are in your record. You don't need to get the year from the accordion title. Your problem is, that the record is not the first param in the handler:

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.column.Action-cfg-handler

items: [{
   icon: 'test',
   tooltip: 'Print PDF Report of this Month?',
   scope: this,
   handler: function(view, rowIndex, colIndex, item, e, record) {
        alert(record.data.month + "/" + record.data.year);
   }
}]

You can look at: http://jsfiddle.net/AMx6r/1279/

Upvotes: 5

Related Questions