$.ajax w jQuery Opcje

[SpiJay]

Witam serdecznie,

zrobiłem takie oto filtrowanie: http://iam4u-server.home.pl/sklep/filter.php aczkolwiek nie działa to w taki sposób w jaki sobie to założyłem...
Pokazuje mi ładnie wysortowane wyniki z bazy, ale nie pamięta wszystkich wartości filtrowania, dla przykładu:

jeżeli wybiorę kolor np czerwony oraz smak np wytrawne, to wyszukuje mi wyłącznie rekordy z wartością "wytrawne", a kolor jest pomijany.
Wiem, że jest wina w skrypcie jQuery, ponieważ ręcznie wpisane wartości w skrypcie PHP działają poprawnie.

Ad1. Macie jakieś rady ?

Ad2. Ponadto chciałbym prosić o wyjaśnienie w jaki sposób wysłać wyniki sortowania z pliku function.php do pliku index.php ?

JS:

[JAVASCRIPT] pobierz, plaintext 
			$(window).load(function() {
 
				$(".filtr").click(function() {
 
					var kolor = $(this).find('div.k').add('id');
					var smak = $(this).find('div.s').attr('id');
					var cena = $(this).find('div.c').attr('id');
					var region = $(this).find('div.r').attr('id');
					var kraj = $(this).find('div.p').attr('id');
 
					$.ajax({
						url: 'function.php',
						data: {
							funkcja: 'szukaj',
							kolor: kolor,
							smak: smak,
							cena: cena,
							region: region,
							kraj: kraj,
							},
						type: 'post',
						success: function(output) {
							$('.jo').remove();
							$("#wyniki").append(output);
							return false;
						}
					});
				});
			});
[JAVASCRIPT] pobierz, plaintext 

PHP:

[PHP] pobierz, plaintext 
	// Ajaxowe wyszukiwanie win
	if(isset($_POST['funkcja']) && !empty($_POST['funkcja'])) {
		switch($_POST['funkcja'])
		{
			case 'szukaj':
				szukaj($_POST['kolor'], $_POST['smak'], $_POST['cena'], $_POST['region'], $_POST['kraj']);
			break;
		}
	}
 
	function szukaj($kolor, $smak, $cena, $region, $kraj) {
		$qwerty = "SELECT * FROM `wina` WHERE
		kolor LIKE '%".$kolor."%'
		AND smak LIKE '%".$smak."%'
		AND cena_handlowa LIKE '%".$cena."%'
		AND region LIKE '%".$region."%'
		AND kraj LIKE '%".$kraj."%'
		ORDER by id";
		$sql = mysql_query($qwerty);
		while($id = mysql_fetch_assoc($sql)) {
			echo '
			<div class="jo" style="background: #aaa; margin-bottom: 5px;">
				'.$id['id'].' |
				'.$id['nazwa'].' |
				'.$id['region'].' |
				'.$id['kraj'].' |
				'.$id['smak'].' |
				'.$id['kolor'].' |
				'.$id['cena_handlowa'].' |
				'.$id['zdj_mini'].' |
				'.$id['zdj_duze'].'
			</div>
			';
		}
	}
[PHP] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
		<div id="filtr-body">
			<div id="filtr-kolor">
				<span class="filtr-name">Kolor</span>
				<div class="filtr"><div class="k" id="cze"><img src="images/wina-i.png" /> Czerwone</div></div>
				<div class="filtr"><div class="k" id="bia"><img src="images/wina-i.png" /> Białe</div></div>
				<div class="filtr"><div class="k" id="roz"><img src="images/wina-i.png" /> Różowe</div></div>
			</div>
			<div id="filtr-cena">
				<span class="filtr-name">Cena</span>
				<div class="filtr"><div class="c" id="1"><img src="images/wina-i.png" /> do 50zł</div></div>
				<div class="filtr"><div class="c" id="2"><img src="images/wina-i.png" /> 50zł - 100zł</div></div>
				<div class="filtr"><div class="c" id="3"><img src="images/wina-i.png" /> ponad 100zł</div></div>
			</div>
			<div id="filtr-smak">
				<span class="filtr-name">Smak</span>
				<div class="filtr"><div class="s" id="slo"><img src="images/wina-i.png" /> Słodkie</div></div>
				<div class="filtr"><div class="s" id="wyt"><img src="images/wina-i.png" /> Wytrawne</div></div>
				<div class="filtr"><div class="s" id="mus"><img src="images/wina-i.png" /> Musujące</div></div>
			</div>
			<div id="filtr-kontynent">
				<span class="filtr-name">Region</span>
				<div class="filtr ameryka"><div class="r" id="ame"><img src="images/wina-i.png" /> Ameryka</div></div>
				<div class="filtr europa"><div class="r" id="eur"><img src="images/wina-i.png" /> Europa</div></div>
			</div>
			<div id="filtr-panstwa">
				<span class="filtr-name">Kraj</span>
				<div class="filtr ameryka"><div class="p" id="arg"><img src="images/wina-i.png" /> Argentyna</div></div>
				<div class="filtr ameryka"><div class="p" id="chi"><img src="images/wina-i.png" /> Chile</div></div>
				<div class="filtr ameryka"><div class="p" id="bra"><img src="images/wina-i.png" /> Brazylia</div></div>
 
				<div class="filtr europa"><div class="p" id="fra"><img src="images/wina-i.png" /> Francja</div></div>
				<div class="filtr europa"><div class="p" id="wlo"><img src="images/wina-i.png" /> Włochy</div></div>
				<div class="filtr europa"><div class="p" id="his"><img src="images/wina-i.png" /> Hiszpania</div></div>
			</div>
			<div id="filtr-result">Znaleziono wyników: <b>4178</b></div>
 
			<div id="wyniki" style="clear: both; float: none;"></div> 
[HTML] pobierz, plaintext 

Pozdrawiam !

[mortus]

Mnie zastanawia, dlaczego używasz do tego div-ów, a nie formularza (ładne formularze można uzyskać za pomocą CSS'a lub pluginów do jQuery)? Niemniej, każdy kliknięty element powinien być w jakiś sposób "oznaczony" (np. dodatkową klasą selected, przy czym zauważ, że pola typu checkbox lub radio już taką "właściwość" posiadają (te zaznaczone)). Można by się zastanowić nad użyciem jQuery UI Selectable. W Twoim przykładzie wybrać mogę tylko jedną z opcji koloru, smaku, ceny itd., co nie jest zbyt słusznym rozwiązaniem, jeśli bierzemy pod uwagę potrzeby potencjalnego użytkownika końcowego (być może klient będzie chciał zarówno białe, jak i różowe wino za które może zapłacić od 99 - 159 zł). Elementy HTML, które posiadają id powinny być elementami "istotnymi", czyli takimi, które dokładnie określają czego dokument HTML i jego treść w tym danym miejscu dotyczy. Chyba nadużywasz id-ów, co może mieć negatywne konsekwencje choćby w kwestii pozycjonowania strony.

Jeśli chodzi o PHP to funkcja szukaj jest źle zorganizowana. Pamiętaj, że skrypt wywoływany jest wraz z każdym kliknięciem/zaznaczeniem elementu, co oznacza, że nie wszystkie parametry w każdym kolejnym wywołaniu funkcji szukaj będą dostępne (ewentualnie będą puste - NULL). Funkcja szukaj również (to o czym pisałem w kwestii zaznaczania wybranych właściwości) nie uwzględnia możliwości wyszukiwania według dwóch i większej liczby wartości parametru np. win w dwóch/trzech/itd. różnych kolorach.

Dane zwracaj w takiej formie, która Ci odpowiada. Ja użyłbym json-a i zwróciłbym tylko i wyłącznie dane pobrane z bazy w postaci tablicy, niemniej nic nie stoi na przeszkodzie, aby zwracać HTML.