2012-02-10 53 views
2

我一直在尋找像Extjs 4中的「加載」商店監聽器之類的東西,但我遇到了一些問題。 1)我的印象是'load'listener方法的'success'參數告訴我們操作是否成功,但'success'參數包含一個數組。我不知道該數組包含的內容,但在調用'success.length'屬性後,我發現它包含我的服務器端代碼作爲響應發送的實際行數。所以我認爲'成功'的財產實際上包含我的數據,但我不確定。 2)如果我在'records'或'success'參數上使用Ext.each()方法,我無法看到加載的實際數據。如何查看實際數據?在Extjs 4的商店中加載監聽器不工作

規範店看起來如下:

Ext.define('myCompany.store.customerDistribution', { 
    extend: 'Ext.data.TreeStore', 
    autoLoad: true, 

    proxy: { 
     type: 'ajax', 
     url: 'data/customerDistribution/customerCount.json', 
     reader: { 
      type: 'array', 
      root: 'resultset' 
     } 
    }, 
    listeners: { 
     load: function(store, records, success) { 
      /*console.log('store - ' + store + 
         ', typeof(store) - ' + typeof(store) + 
         ', records - ' + records + 
         ', records data - ' + records.data + 
         ', success - ' + success + 
         ', type of success - ' + typeof(success)+ 
         ', success length - ' + success.length); 
      if(records == true) { 
       console.log('records is data property...'); 
      } 
      if(store == true) { 
       console.log('store is a data property...'); 
      } 
      for(r in records) { 
       console.log(r + '\ttypeof(r) -> ' + typeof(r)); 
      } */ 
      if(success && records.length > 0) { 
       var allCountries = []; 
       var previousCountry = undefined; 

       var countryIndex = 0; 
       var stateIndex = 1; 
       var cityIndex = 2; 
       var customerCountIndex = 3; 

       Ext.each(records, function(record, index){ 
        console.log('record - ' + record[0] + ', ' + record[1]); 
       }); 
      } 
     } 
    } 
}); 

我想基於行的JSON轉換爲分層JSON顯示在樹面板。這就是我使用加載列表器的原因。 的json看起來如下:

{ 
    "queryInfo":{"totalRows":"100"}, 

    "resultset":[ 
     ["India","India","India",63], 
     ["India",""," Tirupati ",1], 
     ["India",""," UTTARPARA ",1], 
     ["India","Andhra Pradesh",null,61], 
     ["India","Andhra Pradesh"," Chittoor ",1], 
     ["India","Andhra Pradesh"," Guntur ",2], 
     ["India","Andhra Pradesh"," Hyderabad ",58] 
     ], 
    "metadata":[ 
     {"colIndex":0,"colType":"String","colName":"Country"}, 
     {"colIndex":1,"colType":"String","colName":"State"}, 
     {"colIndex":2,"colType":"String","colName":"City"}, 
     {"colIndex":3,"colType":"Integer","colName":"customer_count"} 
    ] 
} 

,我想將其轉換爲:

"resultset": [ 
    countries: [ 
    { 
     name: "India", 
     customer_count: 63 
     states: [ 
      { 
       name: "Andhra Pradesh", 
       customer_count: 61, 
       cities: [ 
        { 
         name: "Tirupati", 
         customer_count: 1 
        }, 
        { 
         name: "UTTARPARA", 
         customer_count: 1 
        }, 
        { 
         name: "Chittoor", 
         customer_count: 1 
        }, 

        { 
         name: "Guntur", 
         customer_count: 2 
        }, 
        { 
         name: "Hydrabad", 
         customer_count: 58 
        } 
       ] 
      } 
     ] 
    } 
] 

請幫助!

回答

7

您選擇了錯誤的加載事件簽名。在TreeStore它有以下簽名load(Ext.data.TreeStore this, Ext.data.NodeInterface node, Ext.data.Model[] records, Boolean successful, Object eOpts)。另外記錄按樹形結構排列,所以不能用each來遍歷它們。

下面是示例代碼它記錄每個記錄在樹安慰:

var store = Ext.create('Ext.data.TreeStore', { 
    model: 'Task', 
    proxy: { 
     type: 'ajax', 
     url: 'treegrid.json' 
    }, 

    logRecord: function(r, depth) { 
     if (!depth) { depth = ''; } 
     console.log(depth + Ext.encode(r.data)); 

     Ext.each(r.childNodes, function(record, index){ 
      this.logRecord(record, depth + ' '); 
     }, this); 
    }, 

    listeners: { 
     load: function(sender, node, records) { 
      Ext.each(records, function(record, index){ 
       this.logRecord(record); 
      }, this); 
     } 
    } 
}); 
+0

真棒!非常感謝@lolo – Shekhar 2012-02-10 09:07:53