2013-05-31 25 views
5

Tôi muốn làm cho danh sách lồng nhau của loại mua sắm sử dụng dữ liệu được cung cấp bởi máy chủ mà trông giống như sau:Re dữ liệu định dạng JSON để phù hợp với cửa hàng cây

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

Kể từ khi cấu trúc cây được gói trong data yếu tố và trẻ em là bọc trong subCategories thẻ đó là khác nhau từ data vì vậy tôi muốn dữ liệu này như vậy mà nó có thể được sử dụng bởi Nested List quá trình trước trực tiếp bằng cách trả lời như thế này:

{ 
    "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 hoặc điều này tôi đã ghi đè getResponseData của người đọc nhưng phương pháp này không bao giờ được gọi và không có bản ghi nào được tải trong cửa hàng. Tôi đang làm gì sai?

Đây là cửa hàng của tôi:

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 
      } 
     } 
    } 
}); 

và đây là mô hình:

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

Đây là danh sách:

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); 
    } 
}); 

thực hành tốt nhất để xử lý & định dạng nhận dữ liệu là gì nếu nó không có định dạng chúng tôi muốn và chúng tôi không có quyền kiểm soát dịch vụ?

+0

Mục đích của việc thay thế khóa trong đối tượng javascript là gì? Bạn không thể đối phó với họ? –

+0

Tôi đang cố thay đổi chuỗi 'dữ liệu' và' chuỗi phụ thành 'danh mục' để khi được phân tích cú pháp được nạp trong lưu trữ cây, danh sách lồng nhau của tôi sẽ hiểu dữ liệu vì tất cả tên cha và con đều giống nhau. Vui lòng kiểm tra câu hỏi khác của tôi cũng có liên quan http://stackoverflow.com/questions/16854839/how-to-specify-rootproperty-for-nested-data-if-it-is-one-level-below – ThinkFloyd

+0

về cơ bản tôi nhận dữ liệu ở một số định dạng khác không giống như dữ liệu được sử dụng trong [ví dụ] (http://docs.sencha.com/touch/2.1.1/#!/guide/nested_list) trong đó 'mục' là tên của mảng trên tất cả những cấp bậc. vì vậy tôi muốn thay đổi dữ liệu nhận được của mình và làm cho nó giống như vậy trước khi nó được tải trong cửa hàng. – ThinkFloyd

Trả lời

0

Tôi không nghĩ rằng bạn có thể đính kèm getResponseData vào cấu hình của người đọc. Trong quá khứ tôi đã sử dụng cách tiếp cận sau đây.

  1. Tạo ghi đè Ext.data.reader.Json như dưới đây. Nhưng nhược điểm là điều này sẽ được gọi cho tất cả các proxy của bạn bằng cách sử dụng trình đọc json. và sau đó thêm YourApp.override.data.reader.Json vào phần yêu cầu của ứng dụng của bạn.

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

  2. Hoặc bạn có thể làm cho một Ext.Ajax.request và xử lý thành công phân tích các dữ liệu theo cách bạn muốn và sau đó thiết lập các dữ liệu trong cửa hàng của bạn. Bạn cũng có thể viết mã này trong sự kiện "làm mới" hoặc sự kiện "beforeload" của cửa hàng và trả về false để hủy hành động

Các vấn đề liên quan