[Prototype] Wybór kategorii jak na allegro ;) Opcje

[phpion]

Witam,
przyznam, że zabawa z Prototype mnie wciągnęła i chciałbym Wam pokazać moją inną pracę.

http://phpworkstation.com/prototype/kategorie.html

Jest to skrypt umożliwiający wybór kategorii w taki sposób w jaki wybiera się kategorie na allegro. Obsługuje nieograniczoną liczbę zagnieżdżeń. Docelowo tablica k ma być tworzona dynamicznie na podstawie bazy danych (Ajax niepotrzebnie spowolniłby skrypt).

Proszę o opinie nt. skrypciku oraz pomoc w pewnym problemie. Mam problem z usuwaniem zbędnych selectów przy cofnięciu się w drzewie kategorii. Sądziłem, że użycie remove() będzie ok ale nie bardzo chce to działać. Tymczasowo więc dałem hide(). Wizualnie wygląda tak jak chciałem jednak elementy nadal siedzą w kodzie, a nie powinny. Gdyby ktoś znał rozwiązanie proszę o info.

[HTML] pobierz, plaintext 
var Category = Class.create();
Category.prototype = {
	initialize: function(id, name) {
		this.id = id;
		this.name = name;
	},
 
	getId: function() {
		return this.id;
	},
 
	getName: function() {
		return this.name;
	}
}
 
var CategoryList = Class.create();
CategoryList.prototype = {
	initialize: function(id) {
		this.id = id;
	},
 
	build: function() {
		var categoryId = this.id;
 
		if (k[this.id]) {
			categoryId = "";
 
			var select = document.createElement("select");
 
			select.setAttribute("size", 10);
 
			select.onchange = function() {
				var i = 0;
 
				while (select.next(i)) {
					//select.next(i).remove(); //<- (IMG:http://forum.php.pl/style_emoticons/default/questionmark.gif) 
				 select.next(i).hide();
					i++;
				}
 
				var cl = new CategoryList(this.value);
				cl.build();
			}
 
			var length = k[this.id].length;
 
			for (var i=0; i<length; i++) {
				var option = document.createElement("option");
				option.text = k[this.id][i].getName();
				option.value = k[this.id][i].getId();
 
				select.appendChild(option);
			}
 
			$("container").appendChild(select);
		}
 
		setCategoryId(categoryId);
	}
}
 
var k = new Array();
 
k[0] = new Array();
k[0][0] = new Category(1, "Kategoria 1");
k[0][1] = new Category(2, "Kategoria 2");
k[0][2] = new Category(3, "Kategoria 3");
 
k[1] = new Array();
k[1][0] = new Category(4, "Kategoria 1 1");
k[1][1] = new Category(5, "Kategoria 1 2");
k[1][2] = new Category(6, "Kategoria 1 3");
 
k[2] = new Array();
k[2][0] = new Category(7, "Kategoria 2 1");
 
k[5] = new Array();
k[5][0] = new Category(8, "Kategoria 1 2 1");
k[5][1] = new Category(9, "Kategoria 1 2 2");
 
function initCategoryList() {
	var categoryList = new CategoryList(0);
	categoryList.build();
}
 
function setCategoryId(id) {
	$("categoryId").value = id;
}
 
Event.observe(window, "load", initCategoryList, false);
[HTML] pobierz, plaintext 

Pozdrawiam: pion

PS: zastanawiałem się czy nie dać tego do "Gotowe rozwiązania" gdyż jest to dość często poszukiwany skrypt, jednak na razie chciałbym poznać opinie na jego temat.
PS2: teraz zauważyłem, że pod IE skrypt nie działa :/ Opera i FireFox śmigają.

Ten post edytował phpion.com 22.11.2007, 21:00:25

[phpion]

to dopisz do tego jak powinna wygladac struktura tabel w bazie oraz kod php do wygenerowania tablicy w JS.

Tabela może mieć różną strukturę ale powinna zawierać polę id, parent_id, name. Tyle jest potrzebne do działania tego skryptu. Kod PHP chyba nie jest trudny do napisania więc jeśli ktoś będzie zainteresowany to sam sobie napisze.

ps. w alledrogo tez tak jest to zrobione? tzn tez od razu wszystkie tablice sa w JS wpisywane? jak bedzie tego 100 tys kategorii to nie bedzie za duzo? przeciez user zazwyczaj wybiera tylko jedna kategorie wiec 90% innych bedzie niepotrzebnie zaladowane, moze zrobisz w AJAX jezeli jest duzo kategorii?(IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Nie wiem czy jest tam użyty Ajax czy nie. Na moje potrzeby odwołania ajaxowe byłyby zbędne, lategorie w spokoju można trzymać w tablicy.

Czy stworze kategorie o poziomie zagnieżdżenia powiedzmy 10 i zacznę wybierać kategorię w Twoim prototype dochodząc do ostatniego poziomu (10), zdecyduje się wybrać inną podkategorię w poziomie 2 to czy wybór wpłynie na wszystkie podkategorie w głąb czy tylko na następną głębiej. ?

Tak, wpłynie na wszystkie następne. Zobacz na przykładzie w podanym przeze mnie linku. Wybierasz kolejno:
- Kategoria 1
- Kategoria 1 2
- Kategoria 1 2 1
po czym chcesz zmienić Kategorię 1 na Kategorię 2. Następuje usunięcie (a konkretnie ukrycie :/) selectów powyżej danego poziomu zagnieżdżenia i pojawiaja się select dla Kategorii 2 (zawierający 1 pozycję Kategoria 2 1).