Voglio fare elenco nidificato di categorie di spesa utilizzando i dati forniti dal server di cui sembra qualcosa di simile:Re dati formattazione JSON per adattarsi al negozio albero
{
"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":[]}
]}
]}
]
}
Dal struttura ad albero è avvolto in data
elemento e bambini sono avvolto in subCategories
tag che è diverso dal data
così ho voluto pretrattare questi dati in modo che possa essere utilizzato da Nested List
direttamente facendo risposta simili:
{
"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":[]}
]}
]}
]
}
F o questo stavo ignorando getResponseData
di lettore, ma questo metodo non viene mai chiamato e nessun record viene caricato nell'archivio. Che cosa sto facendo di sbagliato?
Ecco il mio negozio:
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
}
}
}
});
e qui è il modello:
Ext.define('MyTabApp.model.Category', {
extend : 'Ext.data.Model',
config : {
idProperty : 'itemId',
fields : [
{name : 'itemId',type : 'int'},
{name : 'name',type : 'string'}
]
}
});
Questa è la lista:
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);
}
});
Qual è delle migliori pratiche per elaborare formato & dati ricevuti se non è nel formato che vogliamo e non abbiamo il controllo sui servizi?
Quale sarebbe lo scopo di sostituire le chiavi in un oggetto javascript? Non puoi farcela con loro? –
Sto provando a cambiare le stringhe 'data' e' sottocategorie' in 'categories' in modo che quando viene analizzato caricato nel tree store il mio elenco annidato comprenda i dati perché tutti i nomi genitore e figlio sono uguali. Per favore controlla la mia altra domanda che è anche correlata http://stackoverflow.com/questions/16854839/how-to-specify-rootproperty-for-nested-data-if-it-is-one-level-below – ThinkFloyd
fondamentalmente sono ottenere dati in un altro formato che non è come i dati usati in [esempi] (http://docs.sencha.com/touch/2.1.1/#!/guide/nested_list) dove 'items' è il nome degli array su tutti i livelli. quindi voglio cambiare i miei dati ricevuti e renderli così prima che vengano caricati in negozio. – ThinkFloyd