2012-11-13 59 views
2

這是我得到的json響應。我用JSONLINT進行了檢查,它說有效,但如果你注意到它只給我值而沒有列的標題......列名是「States」。使用單個值json到extjs combobox

{"myTable":["VA","CA","CO","OK","PA","TX"]} 

是否可以使用此JSON在我的組合框加載

items: [{ 
        xtype: 'combo', 
        id: 'iccombo', 
        scope: this, 
        store: this.store, 
        mode: 'remote', 
        minChars: 0, 
        fieldLabel: 'Short State', 
        displayField: 'States', 
        valueField: 'States', 
        typeAhead: true, 
        name: 'States', 
        labelWidth: 125, 
        anchor: '95%' 
       }, 

這是我的商店

var store = Ext.create('Ext.data.Store', { 
     autoLoad: true, 
     id: 'OurData', 
     scope: this, 
     fields: [{ name: 'States' }], 
     proxy: { 
      type: 'ajax', 
      url: 'GetState/getS', 
      reader: { 
       type: 'json', 
       root: 'myTable' 
       idProperty: 'States' 
      } 
     } 
    }); 
+0

你可能會需要使用ArrayStore而非http:/ /docs.sencha.com/ext-js/4-1/#!/api/Ext.data.ArrayStore – dbrin

+0

甚至可以內聯數據:store:[「VA」,「CA」,...] – dbrin

+0

謝謝dbrin ...我的問題是使用一個控制器,返回該JSON格式... m想改變我的控制器 – EagleFox

回答

4

開箱即用的內線在數組閱讀器這幾乎是您的數據格式需要匹配但需要調整。陣列閱讀器可以自定義,將您的數據格式轉換爲所需的格式。這種定製對於許多服務來說很常見,這些服務無法在服務器級別進行修改,所以我們可以通過Ext JS數據框架輕鬆地在UI級別進行調整。

這裏,你可以使用,以及根據你的榜樣和快速循環的實現,顯示由記錄中的數據的自定義讀者:

/** 
* A customized reader to convert a list to an array for the 
* ArrayReader to take 
*/ 
Ext.define('Ext.ux.data.reader.JsonList', { 

    extend: 'Ext.data.reader.Array', 

    alias : 'reader.jsonlist', 

    root: 'myTable', 

    /** 
    * this is really the guts of the change 
    * convert an array of strings to an array of arrays of strings 
    */ 
    extractData: function (root) { 
     var data; 

     if (Ext.isArray(root) && !Ext.isArray(root[0])) { 
      root.forEach(function (val, idx, all) { 
       /* turn the value into an array */ 
       all[idx] = [val]; 
      }) 
     } 

     data = root; 

     /* hand the array of arrays up to the ArrayReader */ 
     return this.callParent([data]); 
    } 
}); 

store = Ext.create('Ext.data.Store', { 
    autoLoad: true, 
    id: 'OurData', 
    scope: this, 
    fields: [{ name: 'State' }], 
    proxy: { 
     /* change this back to ajax to get server data */ 
     type: 'memory', 
     url: 'GetState/getS', 
     reader: { 
      type: 'jsonlist' 
     } 
    }, 

    /* temp data for simplified demo code */ 
    data: {"myTable":["VA","CA","CO","OK","PA","TX"]} 
}); 

/* just to demo that there are six records with State as the field name: */ 
store.each(function (rec, id, total) { 
    console.log(rec.get('State')) 
}); 
+0

+1這個不錯的想法:) – sra

+0

@sra - 謝謝! –

+0

謝謝約翰......這就是我需要的......甜 – EagleFox