Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.01.2012, 11:13
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

Фильтрация дерева
Здравствуйте. Делаю фильтрацию дерева на 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.
Подскажите, пожалуйста
Ответить с цитированием
  #2 (permalink)  
Старый 20.01.2012, 11:43
С++/C# modest developer
Отправить личное сообщение для nekto_O Посмотреть профиль Найти все сообщения от nekto_O
 
Регистрация: 07.11.2011
Сообщений: 244

а в чем проблема?
Ответить с цитированием
  #3 (permalink)  
Старый 20.01.2012, 12:01
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

Проблема в том, что хочется сделать как из примера по ссылке для 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(); что ?

Хочу сделать тоже самое поведение в конечном итоге
Ответить с цитированием
  #4 (permalink)  
Старый 20.01.2012, 12:31
С++/C# modest developer
Отправить личное сообщение для nekto_O Посмотреть профиль Найти все сообщения от nekto_O
 
Регистрация: 07.11.2011
Сообщений: 244

1. Ноды сразу все загружаются или по экспанду родительской?
Сообщение от ICEMAN3141592
2. При очистке триггера для ExtJs.Net-а есть
tree.getRootNode().collapseChildNodes(true);
tree.getRootNode().ensureVisible();
какая есть аналогия ?
А это что по-вашему? -> http://docs.sencha.com/ext-js/3-4/#!...apseChildNodes
http://docs.sencha.com/ext-js/3-4/#!...-ensureVisible
Сообщение от ICEMAN3141592
Для tree.getRootNode().collapseChildNodes(true); вроде как подходит tree.collapseAll();
Это разные методы, collapseChildNodes() коллапсит только дочерние ноды, а collapseAll() вообще все ноды дерева.
Ответить с цитированием
  #5 (permalink)  
Старый 20.01.2012, 12:43
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

Сообщение от nekto_O
1. Ноды сразу все загружаются или по экспанду родительской?
Ах да, забыл, у меня сразу все загружаются, сделал статическое дерево, загружаю через Ajax.Request, потом передаю в children
var rootNode = new Ext.tree.AsyncTreeNode({
				text: 'Отделы',
				draggable: false,
				children: result.departments
			});
tree.setRootNode(rootNode);


Сообщение от nekto_O
А это что по-вашему? -> http://docs.sencha.com/ext-js/3-4/#!...apseChildNodes
http://docs.sencha.com/ext-js/3-4/#!...-ensureVisible
У меня эта ссылка перестала работать в Mozilla Firefox, появляется экран ну и грузится бесконечно, решил сейчас проверить в Chrome, работает, порадовало. А документацией я пользуюсь http://newpg.ru/ExtJS/docs/ , хотя она немного устаревшая.

Сообщение от nekto_O
Это разные методы, collapseChildNodes() коллапсит только дочерние ноды, а collapseAll() вообще все ноды дерева.
Да из названия это понятно просто в старой документации по ExtJs3 нету, а вот 3.4 есть.
Ответить с цитированием
  #6 (permalink)  
Старый 20.01.2012, 12:52
С++/C# modest developer
Отправить личное сообщение для nekto_O Посмотреть профиль Найти все сообщения от nekto_O
 
Регистрация: 07.11.2011
Сообщений: 244

юзайте свежую доку по ExtJS 3.4 http://docs.sencha.com/ext-js/3-4/
Ответить с цитированием
  #7 (permalink)  
Старый 20.01.2012, 12:56
С++/C# modest developer
Отправить личное сообщение для nekto_O Посмотреть профиль Найти все сообщения от nekto_O
 
Регистрация: 07.11.2011
Сообщений: 244

Сообщение от ICEMAN3141592
загружаю через Ajax.Request, потом передаю в children
проще так:
tree.getLoader().load(node);
Ответить с цитированием
  #8 (permalink)  
Старый 20.01.2012, 12:58
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

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

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

Последний раз редактировалось ICEMAN3141592, 20.01.2012 в 13:05.
Ответить с цитированием
  #9 (permalink)  
Старый 20.01.2012, 13:14
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

Сообщение от nekto_O
tree.getLoader().load(node);
О, прикольно, попробую

У TriggerField есть autoWidth, почему оно может не работать в true ?
Ответить с цитированием
  #10 (permalink)  
Старый 20.01.2012, 15:51
Интересующийся
Отправить личное сообщение для ICEMAN3141592 Посмотреть профиль Найти все сообщения от ICEMAN3141592
 
Регистрация: 18.01.2012
Сообщений: 15

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-у
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
необычное раскрытие дерева dsnj jQuery 7 30.11.2011 14:40
TreeStore, стили для элементов дерева. Black_Prince ExtJS 1 26.09.2011 13:33
Как удалить элемент из дерева DOM dummer jQuery 13 16.01.2011 16:19
jQuery, jsTree - обновление дерева через ajax extremum.func jQuery 2 09.11.2009 14:48
jquery.dynatree + cookie не получается запомнить открытый путь дерева. ast-ross jQuery 4 24.03.2009 05:54