Threaded View
-
18 Aug 2011 2:15 AM #1
Problem with dynamically (from db) building TreeStore for Ext.NestedList
Problem with dynamically (from db) building TreeStore for Ext.NestedList
Hi!
I'm working at selecting hierarchical data from database table into my store, which I want bind to Ext.NestedList.
My database table looks like: myTable = [ id, parentId, name ]
The model is:
And the code is:Code:Ext.regModel('myModel', { fields : [ {name: 'id', type: 'int'}, {name: 'parentId', type: 'int'}, {name: 'name', type: 'string'} ] })
The code loading every record into my list, but don't put it in hierarchy. Does someone have idea how to get it work? I want to show NestedList only with main parents and load childrens during selecting items at list.Code:this.dbConn.transaction(function (transaction, results) { var SQL = "SELECT * FROM myTable ORDER BY name ASC"; transaction.executeSql(SQL, [], function (transaction, results){ var dataArr = [], i, since_id = 0, script; if (results.rows && results.rows.length) { for (i = 0; i < results.rows.length; i++) { if (since_id == 0) { since_id = results.rows.item(i).id; } dataArr.push({ id: results.rows.item(i)['id'], parentId: results.rows.item(i)['parentId'], name: results.rows.item(i)['name'] }); } } var store = new Ext.data.TreeStore({ model: 'myModel', nodeParam: 'id', //parentField: 'twgNadrzednaId', //-founded at Ext forum - didn't found at Touch root : { items: dataArr }, proxy : { type : 'ajax', url: '/whateva', reader : { type : 'tree', root : 'items' } }, autoLoad : false }); var nestedList = new Ext.NestedList({ fullscreen : true, title : 'myNestedList', useToolbar: true, updateTitleText: true, getItemTextTpl: function() { return '<div><tpl if="leaf !== true">[^] </tpl>{name}</div>'; }, dock : 'top', store: store }); var groupPanel = new Ext.CustomPanel({ defaults: { scroll: 'vertical' }, floating: true, modal: true, centered: true, width: Ext.Element.getViewportWidth(), height: Ext.Element.getViewportHeight(), scroll: 'vertical', dockedItems: [{ dock: 'top', xtype: 'toolbar', title: 'Group', defaults: { iconMask: true, ui: 'plain' }, items: [{ xtype: 'spacer' }, { iconCls: 'delete', iconMask: true, handler: function(){ groupPanel.hide(); } }] }], items: [nestedList] }); groupPanel.show() }); })
Every help would be appreciated.
Thank you for reporting this bug. We will make it our priority to review this report.


Reply With Quote