将JSON响应元素放入存储 - Ext JS

时间:2014-02-26 20:19:37

标签: json extjs

我想知道将JSON响应的元素加载到商店中的最佳方法是什么。

我有什么:

jQuery ajax请求

var foodRequest = $.ajax({
    url: "MyServlet",
    type: "post",
    cache: false,
    dataType: "json",
    data: JSON.stringify(searchquery),
    error : function() {
        alert ('ERROR!! Please re-enter the search criteria and try again.');
                }
});

ajax回复

{
 "Foods":[
  {
     "Food":{
        "name":"Spaghetti",
        "id":"001",
        "attributes":[
           {
              "attrname":"Price",
              "attrvalue":"18.99"
           },
           {
              "attrname":"Description",
              "attrvalue":"Spaghetti is delicious, don't argue with me"
           },
           etc...

我想要的是什么:

(每个元素有4个属性)

var grid = Ext.define('Myapp.view.Grid' ,{
    extend: 'Ext.grid.Panel',
    id: 'mygrid',', 
    initComponent: function(columns) {

        this.columns = [
            {header: 'attrname',  dataIndex: 'attrvalue', flex: 2 },
            {header: 'attrname',  dataIndex: 'attrvalue', flex: 2 },
            {header: 'attrname',  dataIndex: 'attrvalue', flex: 2 },
            {header: 'attrname',  dataIndex: 'attrvalue', flex: 2 },
            etc...

如何从json响应中获取属性并将它们放入我的网格可以使用的商店中,如上所示?

干杯!

1 个答案:

答案 0 :(得分:1)

您要返回的数据看起来像一棵树。普通网格使用固定列。简而言之:

  • 网格使用商店
  • 商店使用多个字段或模型。
  • 网格有许多预定义列,每列通过dataIndex引用商店(模型)字段。

现在,当商店加载数据时(通过代理或手动转储其中的记录)。它在内部创造了一条记录。记录中可用的字段是您在商店中定义的字段或您在商店使用的模型上定义的字段。

长话短说,网格和商店的正常设置是固定数量的列和字段。在您的情况下,使用TreePanel和存储可能会更好。请查看treepanel示例。

http://docs.sencha.com/extjs/4.0.7/extjs-build/examples/tree/treegrid.html

祝你好运