Question

I want to fire event in custom class written in Extjs 4.

I created a custom class using ExtJs and extended from Observable class
in order to register event.

var settingWindows = Ext.define("Setting", {
    extend: 'Ext.util.Observable',
    title: "",
    window: null,
    userId: 0,
    windowWidth: 650,
    windowHeight: 400,
    columns: [],
    settings: [],
    ruleList: [],
    isColorPickerOpen: false,
    currTrObj: null,
    currColorType: null,

    constructor: function(config) {
        this.windowWidth = config.windowWidth || 650;
        this.windowHeight = config.windowHeight || 400;
        this.title = config.title || "";
        this.userId = config.userId || 0;
        this.settings = config.settings || [];
        this.CreateWindowSettingsWindows();
        this.addEvents('myCustomEvent');
    },
});

In constructor I added registration for myCustomEvent.

And in ajax call I try to invoke

 Ext.Ajax.request({
     url: url,
     contentType: "application/json",
     method: 'POST',
     dataType: 'json',
     jsonData: Ext.encode(this.settings),
     failure: function(response, options) {
         Ext.MessageBox.alert(response.statusText);
     },
     success: function() {
         Ext.MessageBox.alert("Data was updated");
         this.fireEvent('myCustomEvent', 1);
     }
 });

Please avise

Answer 1

if the Ext.Ajax.request is placed into a method of your “Setting” class, simply add the scope parameter to your Ext.Ajax.request call:

Ext.Ajax.request({
        url: url,
        contentType: "application/json",
        method: 'POST',
        dataType: 'json',
        jsonData: Ext.encode(this.settings),
        failure: function (response, options) {
            Ext.MessageBox.alert(response.statusText);
        },
        success: function () {
            Ext.MessageBox.alert("Data was updated");
            this.fireEvent('myCustomEvent', 1);
        },
        scope: this
    })