cómo llamar a un oyente de vista desde el controlador en Extjs

i have a bar chart in my view where i have a listener which is retrieving the bar column items ,now i have to call that listener from controller here is my code ...

This is the listener in my view..

listeners: {
    itemmousedown: function (obj) {
        alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
    }
},

and i have to call this listener from my controller.here is my code..

init: function () {
    this.control({
        'barColumnChart': { //this is the id of the bar chart in my View
            click: function () {

            }
        }
    });
},

preguntado el 05 de mayo de 13 a las 18:05

4 Respuestas

The itemmousedown event is fired by the "series", and the series is not a component, and is only initialized by the chart after layout. So in order to get a reference to the series object we need to wait for the afterlayout event of the chart. But unfortunately the chart is not firing an afterlayout event... So, first override the afterComponentLayout method of chart, such that it fires the event:

Ext.define('MyNewChart',{
    extend: 'Ext.chart.Chart',
    afterComponentLayout: function(width, height, oldWidth, oldHeight) {
        this.callParent(arguments);
        this.fireEvent('afterlayout', this);
    }
});

Now, use our new chart class to create your chart:

Ext.create('MyNewChart', {
     id: 'myChart',
     ...
});

And now we can create a controller that actually create a listener on the itemmousedown event:

Ext.define('Gamma.controller.ControlFile', {
    extend : 'Ext.app.Controller',
    initializedEvents: false,
    init: function() {
        this.control({
            '#myChart': {
                afterlayout: this.afterChartLayout
            }
        });
    },
    afterChartLayout: function(){
        if(this.initializedEvents==true) return;
        this.initializedEvents=true;
        Ext.getCmp('myChart').series.items[0].on('itemmousedown',function(obj){
            console.log(obj);
        });
    }
});

Aquí hay un violín que funciona: http://jsfiddle.net/qjfBC/

contestado el 06 de mayo de 13 a las 13:05

Have you tried using '#barColumnChart' as the selector? I'm a little rusty but I thought that's the way you get a element by its id inside the controller.

contestado el 05 de mayo de 13 a las 18:05

You don't "call" a listener, a listener is being called when an event is fired. So you should set the itemmousedown listener inside the controller, and remove it from the view. I don't know which view has the itemmousedown event, but if it is indeed the bar chart, it should look like this:

this.control({
    '#barColumnChart': { //this is the id of the bar chart in my View
        itemmousedown: function(obj) {
            alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
        }
    }
});

If, however, the event is of another view, you should replace '#barColumnChart' with the id of the correct view (or another selector for that view)

contestado el 05 de mayo de 13 a las 19:05

refs: [{ ref : 'barColumnChart', selector: 'bar' }], - user2262079

init : function() { this.control({ '#bar': { //this is the id of the bar chart in my View itemmousedown: function(obj) { alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']); - user2262079

@Jeet can you please post the (full) code for the view where you had the itemmousedown listener working? maybe edit your original post - Amit Aviv

may i have your mail id i will send the full code of view as well as controller here i cannnot post it properly please its very urgent i need your help... - user2262079

How about creating a jsfiddle? so others might help too. - Amit Aviv

If you create the listener into the controller, you won't have to create it into the view.
In the controller, you can create a reference to your view like this:

refs: [{
    ref     : 'barColumnChart',
    selector: 'your_view'
}
   }]  

Then create the function that will be called on item mouse down:

me.control({
'barColumnChart#your_chart': {
            click: me.your_function
        }
}),

your_function(button, e, options) {
        alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
    }

contestado el 05 de mayo de 13 a las 21:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.