Roo/form/ComboNested.js
[roojs1] / Roo / form / ComboNested.js
index 336442c..43002d5 100644 (file)
@@ -47,6 +47,11 @@ Roo.form.ComboNested = function(config){
 
 Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
    
+    /*
+     * @config {Number} max Number of columns to show
+     */
+    
+    maxColumns : 3,
    
     list : null, // the outermost div..
     innerLists : null, // the
@@ -92,7 +97,7 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
         this.innerLists = [];
         this.views = [];
         this.stores = [];
-        for (var i =0 ; i < 3; i++) {
+        for (var i =0 ; i < this.maxColumns; i++) {
             this.onRenderList( cls, i);
         }
         
@@ -131,7 +136,7 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
     {
         
         var lw = Math.floor(
-                ((this.listWidth * 3 || Math.max(this.wrap.getWidth(), this.minListWidth)) - this.list.getFrameWidth('lr')) / 3
+                ((this.listWidth * this.maxColumns || Math.max(this.wrap.getWidth(), this.minListWidth)) - this.list.getFrameWidth('lr')) / this.maxColumns
         );
         
         this.list.setWidth(lw); // default to '1'
@@ -146,7 +151,9 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
             this.tpl = new Roo.Template({
                 html :  '<div class="'+cls+'-item '+cls+'-item-{cn:this.isEmpty}">{' + this.displayField + '}</div>',
                 isEmpty: function (value, allValues) {
-                    return value.length ? 'has-children' : 'no-children'
+                    //Roo.log(value);
+                    var dl = typeof(value.data) != 'undefined' ? value.data.length : value.length; ///json is a nested response..
+                    return dl ? 'has-children' : 'no-children'
                 }
             });
         }
@@ -154,14 +161,13 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
         var store  = this.store;
         if (i > 0) {
             store  = new Roo.data.SimpleStore({
+                //fields : this.store.reader.meta.fields,
                 reader : this.store.reader,
                 data : [ ]
             });
         }
         this.stores[i]  = store;
-                
-        
-        
+                  
         var view = this.views[i] = new Roo.View(
             il,
             this.tpl,
@@ -183,7 +189,7 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
         //view.on('click', this.onViewClick, this, { list : i });
 
         store.on('beforeload', this.onBeforeLoad, this);
-        store.on('load',  this.onStoreLoad, this, { list  : i});
+        store.on('load',  this.onLoad, this, { list  : i});
         store.on('loadexception', this.onLoadException, this);
 
         // hide the other vies..
@@ -221,7 +227,17 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
      
     
     // -- store handlers..
-    
+    // private
+    onBeforeLoad : function()
+    {
+        if(!this.hasFocus){
+            return;
+        }
+        this.innerLists[0].update(this.loadingText ?
+               '<div class="loading-indicator">'+this.loadingText+'</div>' : '');
+        this.restrictHeight();
+        this.selectedIndex = -1;
+    },
     // private
     onLoad : function(a,b,c,d)
     {
@@ -244,10 +260,7 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
     
         //this.el.focus();
     },
-    onStoreLoad : function ()
-    {
-        Roo.log(arguments);
-    },
+    
     
     // private
     onLoadException : function()
@@ -266,89 +279,106 @@ Roo.extend(Roo.form.ComboNested, Roo.form.ComboBox, {
     onSelectChange : function (view, sels, opts )
     {
         var ix = view.getSelectedIndexes();
-        
-        
-        if (opts.list > 1) {
-             
+         
+        if (opts.list > this.maxColumns - 2) {
             this.setFromData(ix.length ? view.store.getAt(ix[0]).data : {});
             return;
         }
         
         if (!ix.length) {
             this.setFromData({});
-            this.stores[opts.list+1].loadData( [] );
+            var str = this.stores[opts.list+1];
+            str.removeAll();
             return;
         }
         
         var rec = view.store.getAt(ix[0]);
-        this.setFromData(rec.data)
+        if (!this.isLoading) {
+            this.setFromData(rec.data);
+        }
+        
         
         var lw = Math.floor(
-                ((this.listWidth * 3 || Math.max(this.wrap.getWidth(), this.minListWidth)) - this.list.getFrameWidth('lr')) / 3
+                ((this.listWidth * this.maxColumns || Math.max(this.wrap.getWidth(), this.minListWidth)) - this.list.getFrameWidth('lr')) / this.maxColumns
         );
         
-        this.stores[opts.list+1].loadData( typeof(rec.data.cn) == 'undefined' ? [] : rec.data.cn);
+        this.stores[opts.list+1].loadDataFromChildren( rec );
+        var dl = this.stores[opts.list+1]. getTotalCount();
         this.views[opts.list+1].getEl().setHeight( this.innerLists[0].getHeight());
-        this.views[opts.list+1].getEl().setStyle({ display : rec.data.cn.length ? 'block' : 'none' });
+        this.views[opts.list+1].getEl().setStyle({ display : dl ? 'block' : 'none' });
         this.innerLists[opts.list+1].setHeight( this.innerLists[0].getHeight());
-        this.list.setWidth(lw * (opts.list + (rec.data.cn.length ? 2 : 1))); 
+        this.list.setWidth(lw * (opts.list + (dl ? 2 : 1)));
+        
+        if (this.isLoading) {
+            this.selectActive(opts.list);
+        }
+         
     },
     onDoubleClick : function()
     {
         this.collapse(); //??
     },
     
-    setValue : function(v){
-        var text = v;
-        if(this.valueField){
-            var r = this.findRecord(this.valueField, v);
-            if(r){
-                text = r.data[this.displayField];
-            }else if(this.valueNotFoundText !== undefined){
-                text = this.valueNotFoundText;
-            }
-        }
-        this.lastSelectionText = text;
-        if(this.hiddenField){
-            this.hiddenField.value = v;
-        }
-        Roo.form.ComboBox.superclass.setValue.call(this, text);
-        this.value = v;
-    },
+     
+    
     
-    findRecord : function (prop,value)
-    {
-        return this.findRecordInStore(this.store, prop,value);
-    },
     
-     // private
-    findRecordInStore : function(store, prop, value)
+    // private
+    recordToStores : function(store, prop, value, stack)
     {
         var cstore = new Roo.data.SimpleStore({
+            //fields : this.store.reader.meta.fields, // we need array reader.. for
             reader : this.store.reader,
             data : [ ]
         });
         var _this = this;
         var record  = false;
-        if(store.getCount() > 0){
-           store.each(function(r){
-                if(r.data[prop] == value){
-                    record = r;
+       var srec = false;
+        if(store.getCount() < 1){
+            return false;
+        }
+        store.each(function(r){
+            if(r.data[prop] == value){
+                record = r;
+               srec = r;
+                return false;
+            }
+            if (r.data.cn && r.data.cn.length) {
+                cstore.loadDataFromChildren( r);
+                var cret = _this.recordToStores(cstore, prop, value, stack);
+                if (cret !== false) {
+                    record = cret;
+                   srec = r;
                     return false;
                 }
-                if (r.data.cn && r.data.cn.length) {
-                    cstore.loadData( r.data.cn);
-                    var cret = _this.findRecordInStore(cstore, prop, value);
-                    if (cret !== false) {
-                        record = cret;
-                        return false;
-                    }
-                }
-                
-                return true;
-            });
-        }
+            }
+             
+            return true;
+        });
+        if (record == false) {
+           return false
+       }
+       stack.unshift(srec);
         return record;
     },
     
+    /*
+     * find the stack of stores that match our value.
+     *
+     * 
+     */
+    
+    selectActive : function ()
+    {
+        
+       var stack = [];
+       this.findRecordInStore(this.store, this.hiddenName, this.getValue(), stack);
+       
+    }
+       
+        
+    
+    
+    
+    
 });
\ No newline at end of file