Фильтрация дерева
 

Здравствуйте. Делаю фильтрацию дерева на ExtJs 3.4, но не получается что-то. Из примеров нашел только для ExtJs.Net

http://examples.ext.net/#/TreePanel/Advanced/Filter/

var triggerField = new Ext.form.TriggerField({
		fieldLabel: 'Поиск',
		triggerClass: 'x-form-search-trigger',
		enableKeyEvents: true
	});

// toolbar дерева, оно большое, поэтому только часть
tbar: {
			items: [
				{
					xtype: 'tbtext', 
					text: 'Поиск'
				},
				{
					xtype: 'tbspacer'
				},
				triggerField
			]	
		}

triggerField.on('keyUp',
					function(element, event) {
						var text = element.getRawValue();
						if (Ext.isEmpty(text, false)) {
							return;
						}
						
						if (event.getKey() === Ext.EventObject.ESC) {
							element.onTriggerClick();
						} else {
							var regExp = new RegExp(".*" + text + ".*", "i");
							var treeFilter = new Ext.tree.TreeFilter(tree);
							// Если название отдела
							if (isNaN(parseInt(text))) {
								
								treeFilter.filterBy(function (node) {
									return regExp.test(node.text);
								});
							} else {
								treeFilter.filterBy(function (node) {
									return regExp.test(node.id);
								});
							}
						}
					}, 
					triggerField, 
					{ buffer: 100 } 
	);
		
	triggerField.onTriggerClick = function(event) {
		this.setValue(""); 
		//tree.collapseAll();
		tree.getRootNode().expand();
		tree.expandAll();
	//	tree.getRootNode().ensureVisible();
	};

фильтрацию делаю по тексту узлов, так и по id.
Подскажите, пожалуйста :)

а в чем проблема?

Проблема в том, что хочется сделать как из примера по ссылке для Net-а, а не получается.
1. Ввожу символ, проверяет только корень. Я думаю, ну ладно, поставлю вместо filterBy -> filter
treeFilter.filter(regExp, 'text');
не помогло, все равно проверяет только корень.
2. При очистке триггера для ExtJs.Net-а есть
tree.getRootNode().collapseChildNodes(true);
tree.getRootNode().ensureVisible();
какая есть аналогия ?
Для tree.getRootNode().collapseChildNodes(true); вроде как подходит tree.collapseAll();
а для tree.getRootNode().ensureVisible(); что ?

Хочу сделать тоже самое поведение в конечном итоге

1. Ноды сразу все загружаются или по экспанду родительской?
А это что по-вашему? -> http://docs.sencha.com/ext-js/3-4/#!...apseChildNodes
http://docs.sencha.com/ext-js/3-4/#!...-ensureVisibleЭто разные методы, collapseChildNodes() коллапсит только дочерние ноды, а collapseAll() вообще все ноды дерева.

Ах да, забыл, у меня сразу все загружаются, сделал статическое дерево, загружаю через Ajax.Request, потом передаю в children

var rootNode = new Ext.tree.AsyncTreeNode({
				text: 'Отделы',
				draggable: false,
				children: result.departments
			});
tree.setRootNode(rootNode);

У меня эта ссылка перестала работать в Mozilla Firefox, появляется экран ну и грузится бесконечно, решил сейчас проверить в Chrome, работает, порадовало. А документацией я пользуюсь http://newpg.ru/ExtJS/docs/ , хотя она немного устаревшая.

Да из названия это понятно :) просто в старой документации по ExtJs3 нету, а вот 3.4 есть.

юзайте свежую доку по ExtJS 3.4 http://docs.sencha.com/ext-js/3-4/

проще так:

tree.getLoader().load(node);

Я ж говорю, в Mozilla Firefox 9.0.1 у меня все время так

ссылка на изображение, размер: 13.3 кбайт, 1024 x 706 точек

О, прикольно, попробую :)

У TriggerField есть autoWidth, почему оно может не работать в true ?

var treeFilter = new Ext.tree.TreeFilter(tree);
	triggerField.on('keyUp',
					function(element, event) {
						var text = element.getRawValue();
						treeFilter.clear();
						
						if (event.getKey() === Ext.EventObject.ESC || Ext.isEmpty(text, false)) {
							element.onTriggerClick();
						} else {
							var regExp = new RegExp(".*" + text + ".*", "i");
							// Если название отдела
							if (isNaN(parseInt(text))) {	
								/*	treeFilter.filterBy(function (node) {
										return regExp.test(node.text);
									});
								*/
								treeFilter.filter(regExp, 'text'); 
							} else {
								treeFilter.filterBy(function (node) {
									return regExp.test(node.id);
								});
							}
						}
					}, 
					triggerField, 
					{ buffer: 100 } 
	);
		
	triggerField.onTriggerClick = function(event) {
		treeFilter.clear();
		this.setValue(""); 
		tree.getRootNode().collapseChildNodes(true);
		tree.getRootNode().ensureVisible();
	};

На tree.getRootNode().ensureVisible(); выскакивает ошибка
Ext.fly(child, "_scrollChildIntoView") is null
[Прерывать на этой ошибке] Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
, что же не так делаю ?

Да и фильтрация осуществляется только по root-у :(