2013-05-31 4 views
5

मैं डेटा का उपयोग कर खरीदारी श्रेणियों में से नेस्टेड सूची सर्वर द्वारा प्रदान की जो कुछ इस तरह दिखता बनाना चाहते:पुन स्वरूपण 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 तत्व में लपेटा जाता है और बच्चे हैं

{ 
    "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":[]} 
      ]} 
     ]} 
    ] 
} 

एफ: subCategories टैग जो data से अलग है में लिपटे तो मैं सीधे इस तरह प्रतिक्रिया बनाकर पूर्व प्रक्रिया इस डेटा ऐसी है कि वह Nested List द्वारा इस्तेमाल किया जा सकता करना चाहता था या यह मैं पाठक के 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

जावास्क्रिप्ट ऑब्जेक्ट में कुंजियों को बदलने का उद्देश्य क्या होगा? क्या आप उनके साथ सामना नहीं कर सकते? –

+0

मैं 'डेटा' और 'उपश्रेणियों' तारों को 'श्रेणियों' में बदलने की कोशिश कर रहा हूं ताकि जब इसे पेड़ की दुकान में लोड किया गया हो, तो मेरी नेस्टेड सूची डेटा को समझ जाएगी क्योंकि सभी माता-पिता और बच्चे के नाम समान हैं। कृपया मेरा दूसरा प्रश्न देखें जो http://stackoverflow.com/questions/16854839/how-to-specify-rootproperty-for-nested-data-if-it-is-one-level-below – ThinkFloyd

+0

मूल रूप से मैं हूं किसी अन्य प्रारूप में डेटा प्राप्त करना जो [उदाहरण] (http://docs.sencha.com/touch/2.1.1/#!/guide/nested_list) में उपयोग किए गए डेटा की तरह नहीं है, जहां 'आइटम' सभी पर सरणी का नाम है स्तर इसलिए मैं अपना प्राप्त डेटा बदलना चाहता हूं और स्टोर में लोड होने से पहले इसे ऐसा करना चाहता हूं। – ThinkFloyd

उत्तर

0

मुझे नहीं लगता कि आप रीडर कॉन्फ़िगरेशन में getResponseData संलग्न कर सकते हैं। अतीत में मैंने निम्नलिखित दृष्टिकोण का उपयोग किया है।

  1. Ext.data.reader.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 बना सकते हैं और सफलता हैंडलर पर डेटा को आपकी इच्छानुसार पार्स और फिर अपने स्टोर में डेटा निर्धारित किया है। आप इस कोड को "रीफ्रेश" ईवेंट या स्टोर के "प्रीलोड" ईवेंट में भी लिख सकते हैं और कार्रवाई को रद्द करने के लिए झूठी वापसी कर सकते हैं

संबंधित मुद्दे