[Ext JS 4.0.7] TreePanel & XML

Bonjour,

Je travaille actuellement sur la migration en Ext JS 4.0.7 d'une application développée en Ext JS 3.x.

J'essaie de construire un TreePanel à partir d'un flux XML que je ne peux pas modifier car utilisé dans d'autre version de l'application.

La structure est la suivante :

Code:

---

1 2 3 4 5 6 7 8 9 10

<root> <dossier text="un dossier"> <document text="un premier document" /> <document text="un second document" /> <dossier text="sous dossier"> <document text="document dusous dossier" /> </dossier> </dossier> <document code="string" text="document a la racine" /> </root>

---

Et je cherche à avoir un TreePanel qui ressemble à ça :

Code:

---

1 2 3 4 5 6

un dossier .....un premier document .....un second document .....sous dossier ..........document du sous dossier document a la racine

---

Pour se faire, j'ai créé mes modèles de données (je n'ai pas mis tout les champs dans la structure du XML au dessus pour plus de clarté, seul le champ "text" est important pour le moment) :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

Ext.define('document', { extend: 'Ext.data.Model', belongsTo: 'dossier', fields: [ {name: 'text', type: 'string'}, {name: 'code', type: 'string'}, {name: 'multidest', type: 'boolean'}, {name: 'mailservice', type: 'boolean'}, {name: 'cdmailservice', type: 'boolean'}, {name: 'archiveservice', type: 'boolean'}, {name: 'prod', type: 'boolean'} ] });   Ext.define('dossier', { extend: 'Ext.data.Model', belongsTo: 'Tab', hasMany: [ {model: 'document', name: 'documents'}, {model: 'dossier', name: 'dossiers'} ], fields: [ {name: 'text', type: 'string'}, {name: 'code', type: 'string'} ] });   Ext.define('Tab', { extend: 'Ext.data.Model', hasMany: {model: 'Dossier', name: 'dossiers'}, fields: [ {name: 'code', type: 'string'} ] });

---

Je créé ensuite mon TreeStore qui va aller récupérer les données issues du XML :

Code:

---

1 2 3 4 5 6 7 8 9 10

var store = Ext.create('Ext.data.TreeStore', { model: 'Tab', proxy: { type: 'ajax', url: url, reader: { type: 'xml' } } });

---

Et ensuite vient mon TreePanel :

Code:

---

1 2 3

var treepanel = Ext.create('Ext.tree.Panel', { store: store });

---

Mais après je suis bloqué. Forcement, rien ne s'affiche puisque la structure XML attendue est une liste de "node" comme on peut le voir dans l'exemple de Sencha.

Je ne comprend pas comment faire pour que mon flux soit interprété de cette manière. Il doit me manquer une brique mais j'ai beau chercher, je n'ai rien trouvé.
Sur la version 3.x de l'application, c'est le reader (XmlTreeLoader) qui s'occupe de gérer ça avec une fonction qui attribue à chaque noeud de mon XML toutes les propriétés que le TreePanel comprend.

Code:

---

1 2 3 4 5 6 7

if (attr.tagName == 'dossier'){ attr.qtip = attr.text; attr.leaf = false; attr.expanded = true; attr.loaded = true; attr.id = attr.code; }

---

Est-ce que quelqu'un à déjà construit un TreePanel de cette manière et pourrai m'éclairer ?

D'avance, merci pour votre aide :)