Как использовать фильтр в дереве ? ExtJS 3.4
Подскажите, пожалуйста, как использовать фильтрацию узлов дерева в ExtJS 3.4 ? Создал Ext.tree.TreeFilter, но он проверяет только атрибут корня и все :(
|
Насколько я понял c фильтрацией в дереве совсем плохо. Даже в 4-ке предлагаются прыжки с переподвыподвертом над Гибралтаром в виде добавления/удаления узлов, cascadeBy etc. Для 3-ки ж попробуйте Ext.ux.tree.TreeFilterX от Saki Мо удовлетворит...
|
У меня так работает:
var config = { readOnly: false, isExpand: false, mode: 'local', treeFilter: new Ext.tree.TreeFilter(this.getTree(), { autoClear: true, filterBy : function(fn, scope, startNode){ startNode = startNode || this.tree.root; if(this.autoClear){ this.clear(); } var found = {}; var af = this.filtered, rv = this.reverse; var f = function(n){ if(n == startNode){ return true; } if(af[n.id]){ return false; } var m = fn.call(scope || n, n); if(!m || rv){ af[n.id] = n; // n.ui.hide(); // return false; return true; } found[n.id] = n; return true; }; startNode.cascade(f); for(var idf in found){ if(typeof idf != "function"){ var curFoundItem = found[idf]; var p = curFoundItem.parentNode; while(p){ delete af[p.id]; p = p.parentNode; } } } for(var id in af){ if(typeof id != "function"){ var n = af[id]; n.ui.hide(); } } //startNode.cascade(f2); if(this.remove){ for(var id in af){ if(typeof id != "function"){ var n = af[id]; if(n && n.parentNode){ n.parentNode.removeChild(n); } } } } } }), listeners: { scope: this, beforequery: function(){ return false; }, keyup: { fn: function(field, key){ if(!this.isExpand) this.expand(); var value = field.getRawValue(); if(Ext.isEmpty(value) && !Ext.isEmpty(field.treeFilter)){ field.treeFilter.clear(); return; } var re = new RegExp('' + value + '', 'i'); var tree = field.getTree(); tree.expandAll(); field.treeFilter.filter(re); }, buffer: 250 } } } |
Спасибо большое всем за отзывчивость :thanks:
miha-ha, я сделал почти как Вы, но у Вас лучше структурирован код (не догадался так переопределить filterBy, пошел через переопределение prototype, а не экземпляра, так что Ваш безусловно лучше, также переопределил cascade) |
Чуть не в тему, но быть может кто знает, как сделать для
var triggerField = new Ext.form.TriggerField({ grow: true, growMax: 800, width: 350, autoWidth: true, fieldLabel: "Поиск", triggerClass: "x-form-search-trigger", enableKeyEvents: true }); tbar: { items: [ { xtype: "tbtext", text: "Поиск" }, { xtype: "tbspacer" }, triggerField ] } чтобы текстовое поле расширялось по длине tbar, а не при фиксированной длине в 350 ? |
Часовой пояс GMT +3, время: 10:40. |