Как использовать фильтр в дереве ? 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, время: 20:48. |