2013-05-31 1 views
5

Я хочу сделать вложенный список торговых категорий, используя данные, представленный на сервере, который выглядит примерно так:Re данных форматирования JSON, чтобы вписаться в хранилище дерева

{ 
    "status":{"statusCode":15001}, 
    "data":[ 
     {"itemId":1, "name":"Men", "subCategories":[ 
      {"itemId":2, "name":"Clothes", "subCategories":[ 
       {"itemId":3, "name":"Formals", "leaf":true,"subCategories":[]}, 
       {"itemId":4, "name":"Casual", "leaf":true,"subCategories":[]}, 
       {"itemId":5, "name":"Sports", "leaf":true,"subCategories":[]} 
      ]}, 
      {"itemId":6, "name":"Accessories", "subCategories":[ 
       {"itemId":7, "name":"Formals", "leaf":true,"subCategories":[]}, 
       {"itemId":8, "name":"Casual", "leaf":true,"subCategories":[]}, 
       {"itemId":9, "name":"Sports", "leaf":true,"subCategories":[]} 
      ]} 
     ]}, 
     {"itemId":10, "name":"Women", "subCategories":[ 
      {"itemId":11, "name":"Clothes", "subCategories":[ 
       {"itemId":12, "name":"Formals", "leaf":true,"subCategories":[]}, 
       {"itemId":13, "name":"Casual", "leaf":true,"subCategories":[]}, 
       {"itemId":14, "name":"Ethnic", "leaf":true,"subCategories":[]} 
      ]}, 
      {"itemId":15, "name":"Shoes", "subCategories":[ 
       {"itemId":16, "name":"Hells", "leaf":true,"subCategories":[]}, 
       {"itemId":17, "name":"Wedges", "leaf":true,"subCategories":[]}, 
       {"itemId":18, "name":"Sports", "leaf":true,"subCategories":[]} 
      ]} 
     ]} 
    ] 
} 

Поскольку структура дерева обернута в data элементе и дети завернутый в subCategories теге, который отличается от data поэтому я хотел бы предварительно обработать эти данные таким образом, что он может быть использован непосредственно Nested List, сделав ответ так:

{ 
    "categories":[ 
     {"itemId":1, "name":"Men", "categories":[ 
      {"itemId":2, "name":"Clothes", "categories":[ 
       {"itemId":3, "name":"Formals", "leaf":true,"categories":[]}, 
       {"itemId":4, "name":"Casual", "leaf":true,"categories":[]}, 
       {"itemId":5, "name":"Sports", "leaf":true,"categories":[]} 
      ]}, 
      {"itemId":6, "name":"Accessories", "categories":[ 
       {"itemId":7, "name":"Formals", "leaf":true,"categories":[]}, 
       {"itemId":8, "name":"Casual", "leaf":true,"categories":[]}, 
       {"itemId":9, "name":"Sports", "leaf":true,"categories":[]} 
      ]} 
     ]}, 
     {"itemId":10, "name":"Women", "categories":[ 
      {"itemId":11, "name":"Clothes", "categories":[ 
       {"itemId":12, "name":"Formals", "leaf":true,"categories":[]}, 
       {"itemId":13, "name":"Casual", "leaf":true,"categories":[]}, 
       {"itemId":14, "name":"Ethnic", "leaf":true,"categories":[]} 
      ]}, 
      {"itemId":15, "name":"Shoes", "categories":[ 
       {"itemId":16, "name":"Hells", "leaf":true,"categories":[]}, 
       {"itemId":17, "name":"Wedges", "leaf":true,"categories":[]}, 
       {"itemId":18, "name":"Sports", "leaf":true,"categories":[]} 
      ]} 
     ]} 
    ] 
} 

Р или это я переопределял getResponseData читателя, но этот метод никогда не вызывается, и записи не хранятся в магазине. Что я делаю не так?

Вот мой магазин:

Ext.define('MyTabApp.store.CategoriesStore',{ 
    extend:'Ext.data.TreeStore', 
    config:{ 
     model : 'MyTabApp.model.Category', 
     autoLoad: false, 
     storeId : 'categoriesStore', 
     proxy: { 
      type: 'ajax', 
      url: Properties.CONFIG_SERVICE_BASE_URL+'topnav/getall', 
      reader: { 
       type: 'json', 
       getResponseData: function(response) { 
        console.log("in getResponseData"); // Never logged in console 
        var rText = response.responseText; 
        var processed = Helper.replaceAll("data","categories",rText); 
        processed = Helper.replaceAll("subCategories","categories",processed); 
        var respObj = Ext.JSON.decode(processed); 
        return respObj.categories; 
       } 
      } 
     }, 
     listeners:{ 
      load: function(me, records, successful, operation, eOpts){ 
       console.log("categories tree loaded"); 
       console.log(records); // This prints blank array 
      } 
     } 
    } 
}); 

и вот модель:

Ext.define('MyTabApp.model.Category', { 
    extend : 'Ext.data.Model', 
    config : { 
     idProperty : 'itemId', 
     fields  : [ 
      {name : 'itemId',type : 'int'}, 
      {name : 'name',type : 'string'} 
     ] 
    } 
}); 

Это список:

Ext.define('MyTabApp.view.CategoriesList', { 
    extend: 'Ext.dataview.NestedList', 
    alias : 'widget.categorieslist', 
    config: { 
     height    : '100%', 
     title    : 'Categories', 
     displayField  : 'name', 
     useTitleAsBackText : true, 
     style    : 'background-color:#999 !important; font-size:75%', 
     styleHtmlContent : true, 
     listConfig: { 
      itemHeight: 47, 
      itemTpl : '<div class="nestedlist-item"><div style="position:absolute; left:10px; top:10px; color:#222; font-size:130%">{name}</div></div>', 
      height : "100%" 
     } 
    }, 
    initialize : function() { 
     this.callParent(); 
     var me = this; 

     var catStore = Ext.create('MyTabApp.store.CategoriesStore'); 
     catStore.load(); 
     me.setStore(catStore); 
    } 
}); 

Что лучше практика обрабатывать формат & полученных данных если он не в том формате, который мы хотим, и у нас нет контроля над услугами?

+0

Что было бы целью замены ключей в объекте javascript? Ты не справишься с ними? –

+0

Я пытаюсь изменить строки 'data' &' subCategories' на 'categories', так что когда он будет разобран, загружен в хранилище деревьев, мой вложенный список будет понимать данные, потому что все родительские и дочерние имена одинаковы. Пожалуйста, проверьте мой другой вопрос, который также связан с http://stackoverflow.com/questions/16854839/how-to-specify-rootproperty-for-nested-data-if-it-is-one-level- ниже – ThinkFloyd

+0

в основном я получение данных в другом формате, который не похож на данные, используемые в [примерах] (http://docs.sencha.com/touch/2.1.1/#!/guide/nested_list), где 'items' - это имя массивов на всех уровней. поэтому я хочу изменить полученные данные и сделать это так, прежде чем он будет загружен в магазин. – ThinkFloyd

ответ

0

Я не думаю, что вы можете прикрепить getResponseData к конфигурации читателя. В прошлом я использовал следующий подход.

  1. Создайте переопределение Ext.data.reader.Json, как показано ниже. Но недостатком является то, что это будет вызвано для всех ваших прокси-серверов с помощью json-ридера. а затем добавьте файл YourApp.override.data.reader.Json в раздел требуемых приложений.

    Ext.define('YourApp.override.data.reader.Json', { override: 'Ext.data.reader.Json', 'getResponseData': function(response) { // your implementation here }

  2. В качестве альтернативы вы можете сделать Ext.Ajax.request и обработчиком успеха разобрать данные так, как вы хотите, и затем установите данные в вашем магазине. Вы также можете записать этот код в событии «refresh» или «beforeload» в магазине и вернуть false для отмены действия

 Смежные вопросы

  • Нет связанных вопросов^_^