NestedList wont machen

Question

Ich baue eine app in Sencha Touch 2 eine PhoneGap-Wrapper verwenden. Ich bin in MVC-Modell-Codierung, hier ist der Link der App in einem Web-Server (für debug): http://nqatalog.negroesquisso.pt/APP/ LOGIN: Benutzer: 1, Passwort: 1

ich eine verschachtelte Liste mit einem TreeStor habe ihre Daten zu laden und .json Datei mit den Daten.

Modell

Ext.define('APP.model.menuitem',{ 
       extend: 'Ext.data.Model', 
       condig: { 
        fields: ['id', 'name', 'description', 'items'] 
       } 
      }); 

Shop

Ext.define('APP.store.nestedmenu', { 
extend: 'Ext.data.TreeStore', 

config: { 
    model: 'APP.model.menuitem', 

    autoLoad: true, 

    proxy: { 
     type: 'ajax', 
     url: 'data/menu.json', 
     reader: { 
      type: 'json', 
      rootProperty: 'items' 
     } 
    } 
} 
}); 

Ansicht

Ext.define('APP.view.MenuNestedList', { 
extend: 'Ext.dataview.NestedList', 
xtype: 'menunestedlist', 
id: 'debug', 

config: { 
    store: 'nestedmenu' 
}, 
}); 

Eine andere Ansicht, ruft die vorherige

Ext.define("APP.view.Leftmenu", { 
extend: 'Ext.Panel', 
xtype: 'leftmenu', 

config: { 

    items: [ 
     { 
      xtype: 'menunestedlist' 
     } 
    ], 


    listeners: { 
     painted: function() { 


     } 
    }, 
}, 

onleafitemtap: function() {} 
}); 

Diese verschachtelte Liste wird leer dargestellt (wie Sie sehen und debuggen, wenn Sie im obigen Link wollen)

Vielen Dank für Ihre Zeit.

* EDIT (Daten/menu.json)

{ 
"items": [ 
    { 
     "id": 1, 
     "name": "Section #1", 
     "description": "Lorem ipsum dolor sit", 

     "items": [ 
      { 
       "id": 8, 
       "name": "Product #1", 
       "description": "Lorem ipsum dolor sit", 
       "leaf": true 
      }, 
      { 
       "id": 9, 
       "name": "Product #2", 
       "description": "Lorem ipsum dolor sit", 
       "leaf": true 
      } 
     ] 
    },   
    { 
     "id": 2, 
     "name": "Section #2", 
     "description": "Lorem ipsum dolor sit", 

     "items": [ 
      { 
       "id": 3, 
       "name": "Section #3", 
       "description": "Lorem ipsum dolor sit", 

       "items": [ 
        { 
         "id": 10, 
         "name": "Product #3", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        }, 
        { 
         "id": 11, 
         "name": "Product #4", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        } 
       ] 
      }, 
      { 
       "id": 4, 
       "name": "Section #4", 
       "description": "Lorem ipsum dolor sit", 

       "items": [ 
        { 
         "id": 12, 
         "name": "Product #5", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        }, 
        { 
         "id": 13, 
         "name": "Product #6", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        } 
       ] 
      }, 
      { 
       "id": 5, 
       "name": "Section #5", 
       "description": "Lorem ipsum dolor sit", 

       "items": [ 
        { 
         "id": 14, 
         "name": "Product #7", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        } 
       ] 
      }, 
      { 
       "id": 6, 
       "name": "Section #6", 
       "description": "Lorem ipsum dolor sit", 

       "items": [ 
        { 
         "id": 15, 
         "name": "Product #8", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        }, 
        { 
         "id": 16, 
         "name": "Product #9", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        }, 
        { 
         "id": 17, 
         "name": "Product #10", 
         "description": "Lorem ipsum dolor sit", 
         "leaf": true 
        } 
       ] 
      } 
     ]    
    }, 
    { 
     "id": 7, 
     "name": "Section #7", 
     "description": "Lorem ipsum dolor sit", 

     "items": [ 
      { 
       "id": 18, 
       "name": "Product #11", 
       "description": "Lorem ipsum dolor sit", 
       "leaf": true 
      }, 
      { 
       "id": 19, 
       "name": "Product #12", 
       "description": "Lorem ipsum dolor sit", 
       "leaf": true 
      }, 
      { 
       "id": 20, 
       "name": "Product #13", 
       "description": "Lorem ipsum dolor sit", 
       "leaf": true 
      } 
     ] 
    } 
]  
} 

Answer 1

Ricardo,

Ich war gerade das gleiche Problem haben, und ich nahm noch einen Blick auf die NestedList sample in der Sencha-Dokumentation. Ich bemerkte, dass alle Daten und Datensammlungen die gleichen Schlüssel (Elemente/Text) hatten. Ich habe versucht, meine JSON-Antwort anzupassen und festgestellt, dass es funktioniert hat. Hier ist mein Code:

JSON VON PHP

{ 
    "items": 
    [{ 
      "text":"Other", 
      "items": 
      [{ 
        "text":"Employee IDs", 
        "leaf":"true" 
      }] 
    }] 
} 

JAVASCRIPT

Ext.define('ListItem', { 
    extend: 'Ext.data.Model', 
    config: { 
     fields: ['text'] 
    } 
}); 

var treeStore = Ext.create('Ext.data.TreeStore', { 
    model: 'ListItem', 
    defaultRootProperty: 'items', 
    proxy: { 
     type: 'ajax', 
     url: 'data/get_sections.php', 
     reader: { 
      type: 'json', 
      rootProperty: 'items' 
     } 
    } 
}); 

EDIT

Es sieht aus wie das Model Definition das Wort "Condig" hat anstelle von "config". Auch scheint es, als ob der NestedList die Verwendung von „Elementen“ für Sammlungen und „Text“ für Beschreibungen erfordert.

Answer 2

ich viel Zeit mit dem gleichen Problem verbracht, bis ich ich vergessen erkannt hatte, mein neues Store (nestedmenu, zum Beispiel) in den Filialen Array für die Anwendung in app.js. zur Liste