javascript - ExtJs 多次 Ajax 调用

Question

我正在尝试学习 extjs 4.1 MVC。我有一个具有多个 ajax 调用的 Controller 。当代码在 Firefox 上运行时，我可以看到所有 ajax 调用都已发出，但只有一个成功方法的警报出现。同时可以查看所有 4 个调用的数据。有什么建议我做错了什么吗？代码如下:

Ext.define('App.controller.StartupController', {
extend : 'Ext.app.Controller',

models : [ 'BasicModel' ],

stores : [ 'UserStore','RoleStore','RegionStore','ProductStore','FunctionStore' ],

views : [ 'FooterContainer', 'BodyContainer' ],

init : function() {
    this.loadStore();
    this.loadRole();
    this.loadRegion();
    this.loadFunction();
    this.loadProduct();
    this.control({

    });
},
loadRole: function(){
    // create an AJAX request for role
    var roleStore = this.getRoleStoreStore();
    Ext.Ajax.request({
        url : 'forms/loadRole',
        method : 'POST',
        headers : {
            'Content-Type' : 'application/json'
        },
        params : {
            "test" : "testParam"
        },
        success : function(response) {
            var jsonResp = Ext.JSON.decode(response.responseText);
            roleStore.loadData(jsonResp);
            Ext.Msg.alert("Info", "UserName from Server 1: "+ jsonResp.userName);
        },
        failure : function(response) {
            var jsonResp = Ext.decode(response);
            Ext.Msg.alert("Error", jsonResp.error);
        }
    });
},
loadRegion: function(){
    // create an AJAX request for region
    var regionStore = this.getRegionStoreStore();
    Ext.Ajax.request({
        url : 'forms/loadRegion',
        method : 'POST',
        headers : {
            'Content-Type' : 'application/json'
        },
        params : {
            "test" : "testParam"
        },
        success : function(response) {
            var jsonResp = Ext.JSON.decode(response.responseText);
            regionStore.loadData(jsonResp);

            Ext.Msg.alert("Info", "UserName from Server 2: "+ jsonResp.userName);
        },
        failure : function(response) {
            var jsonResp = Ext.decode(response);
            Ext.Msg.alert("Error", jsonResp.error);
        }
    });
},
loadFunction: function(){
    // create an AJAX request for function
    var functionStore = this.getFunctionStoreStore();
    Ext.Ajax.request({
        url : 'forms/loadFunction',
        method : 'POST',
        headers : {
            'Content-Type' : 'application/json'
        },
        params : {
            "test" : "testParam"
        },
        success : function(response) {
            var jsonResp = Ext.JSON.decode(response.responseText);
            functionStore.loadData(jsonResp);
            Ext.Msg.alert("Info", "UserName from Server 3: "+ jsonResp.userName);
        },
        failure : function(response) {
            var jsonResp = Ext.decode(response);
            Ext.Msg.alert("Error", jsonResp.error);
        }
    });
},
loadProduct: function(){
    // create an AJAX request for product
    var productStore = this.getProductStoreStore();
    Ext.Ajax.request({
        url : 'forms/loadProduct',
        method : 'POST',
        headers : {
            'Content-Type' : 'application/json'
        },
        params : {
            "test" : "testParam"
        },
        success : function(response) {
            var jsonResp = Ext.JSON.decode(response.responseText);
            productStore.loadData(jsonResp);
            Ext.Msg.alert("Info", "UserName from Server 4: "+ response.responseText);
        },
        failure : function(response) {
            var jsonResp = Ext.decode(response);
            Ext.Msg.alert("Error", jsonResp.error);
        }
    });
},
loadStore : function() {
}

});

Answer 1

我猜发生的情况是 ext 只有 MessageBox 组件的一个实例，并且它被调用了四次......但您只能看到最后一个。如果您只是想要某种形式的反馈，我会使用 console.log 而不是 Ext.Msg.alert。