Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][PHP]Problem z dynamicznym generowaniem formularza
Forum PHP.pl > Forum > Przedszkole
sebap123
12.12.2010, 11:02:59
Witam
Od niedawna tworzę coś w JavaScript i dlatego postanowiłem umieścić ten problem tutaj, ale nie wiem czy należy on do błędów podstawowych. Ale do rzeczy.
Znalazłem w necie dosyć prostą instrukcję, a raczej gotowy skrypt, który przy zmianie wybranej opcji pola typu select pobiera z bazy danych dane na ten temat i wyświetla bez przeładowania na stronie.
Mi jest potrzebny podobny skrypt, jednak ten ma pod wpływem wyboru w jednym polu select pobrać dane z tablicy i umieścić je jako opcje w drugim polu select. Trochę już nad tym siedzę, dlatego postanowiłem tutaj spytać się co może robię źle.
Oto całość:
index.html
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  5. <script type="text/javascript">
  6. function showColor(nr)
  7. {
  8. 	if(window.XMLHttpRequest){
  9. 		xmlhttp = new XMLHttpRequest();
  10. 	}
  11. 	else{
  12. 		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  13. 	}
  14. xmlhttp = new onreadystatechange = function()
  15. 	{
  16. 		if(xmlhttp.readyState==4 && xmlhttp.status==200){
  17. 			document.getElementById("selector_c").innerHTML=xmlhttp.responseText;
  18. 		}
  19. 	}
  20. xmlhttp.open("GET","getproduct.php?pr="+nr,true);
  21. xmlhttp.send();
  22. }
  23. </script>
  24. <title>Untitled Document</title>
  25. </head>
  26.  
  27. <body>
  28. <div class="selector2">
  29. 					<label for="rozmiar">rozmiar:</label>
  30. 					<select name="rozmiar" id="selector_r" onchange="showColor(this.value)">
  31. 						<option value="0"></option>
  32.                         <option value="1">czarny</option>
  33. 						<option value="2">marka1</option>
  34. 					</select>
  35. 				</div>
  36.  
  37. 				<div class="selector2">
  38. 					<label for="kolor">kolor:</label>
  39. 					<select name="color" id="selector_c">
  40. 						<option value=""></option>
  41. 					</select>
  42. 				</div>
  43. </body>
  44. </html>
[HTML] pobierz, plaintext

getproduct.php
[PHP] pobierz, plaintext 
  1. <?
  2. include('engine/config.php');
  3. $p=$_GET['pr'];
  4. echo'<option value="1">nowy</option>';
  5. $sql=mysql_query("SELECT FROM colors WHERE id='".$p."'");
  6. if(mysql_fetch_array($sql)==1){
  7. $size=mysql_fetch_array($sql);
  8. {
  9. 						echo'<option value="'.$size['s_id'].'">'.$size['size'].'</option>';
  10. 						}
  11. else{
  12. echo'
  13. 						<option value=""></option>
  14. 						<option value="1">r</option>
  15. 						<option value="2">rodzaj1</option>';
  16. }
  17. ?>
[PHP] pobierz, plaintext

Oba pliki są na tym samym poziomie.
Możliwe, że jest to jakiś głupi błąd, ale ja jakoś patrzę i nic nie widzę.
CuteOne
12.12.2010, 14:48:52 
[PHP] pobierz, plaintext 
  1. if(mysql_fetch_array($sql)==1){
  2. $size=mysql_fetch_array($sql);
  3. {
[PHP] pobierz, plaintext

zamień na 
[PHP] pobierz, plaintext 
  1. if(mysql_fetch_array($sql)==1){
  2. {
  3.      $size=mysql_fetch_array($sql);
[PHP] pobierz, plaintext
sebap123
12.12.2010, 16:01:24
Zamieniłem tak jak mówiłeś i nadal nic. Prawdę powiedziawszy, to nie wiem za bardzo co dała twoja zmiana. Jedyne co zauważyłem, to to, że mam dwa nawiasy klamrowe po if, a tylko jeden jest mi potrzebny dlatego drugiego wywaliłem. Aktualnie kod getproduct.php wygląda tak:
[PHP] pobierz, plaintext 
  1. <?
  2. include('engine/config.php');
  3. $p=$_GET['pr'];
  4. echo'<option value="1">nowy</option>';
  5. $sql=mysql_query("SELECT FROM colors WHERE id='".$p."'");
  6. if(mysql_fetch_array($sql)==1)
  7. {
  8.      $size=mysql_fetch_array($sql);
  9. 						echo'<option value="'.$size['s_id'].'">'.$size['size'].'</option>';
  10. 						}
  11. else{
  12. echo'
  13. 						<option value=""></option>
  14. 						<option value="1">r</option>
  15. 						<option value="2">rodzaj1</option>';
  16. }
  17. ?>
[PHP] pobierz, plaintext


I co najgorsza, cały czas nie chce się ruszyć nic.
lord2105
12.12.2010, 16:09:19
Dlaczego tak:
[PHP] pobierz, plaintext 
  1. if(mysql_fetch_array($sql)==1)
  2. {
[PHP] pobierz, plaintext

a nie tak:
[PHP] pobierz, plaintext 
  1. if(mysql_num_rows($sql)==1)
  2. {
[PHP] pobierz, plaintext
sebap123
12.12.2010, 16:54:19
Prawdę powiedziawszy to nie do końca wiem czemu akurat tak, ale nawet po zmianie nie chce się ruszyć, tak więc to nie to.
markonix
12.12.2010, 17:00:18
Przetestowałeś poprawność działania AJAX?
Na początek sprawdzić czy jest ok dając jakieś echo.

Jeśli się wyświetla idziesz krok dalej, pobranie zmiennej - czy działa.

Jeśli tak to coś z zapytaniem.

Kod
mysql_query("SELECT FROM colors WHERE id='".$p."'");


Nie wystarczy:
Kod
mysql_query("SELECT FROM colors WHERE `id` = $p ");

? Oczywiście jeśli id jest numeryczne.

Potem jeśli jest wszystko ok to pętla i warunek.
Tu już bym ponowił zalecenia Lord'a.
lord2105
12.12.2010, 17:05:52
dziwisz się ze nie działa skoro tego nie chcesz, karzesz wyciągać z bazy ale co?

[PHP] pobierz, plaintext 
  1. $sql=mysql_query("SELECT FROM colors WHERE id='".$p."'");
[PHP] pobierz, plaintext


a może: 

[PHP] pobierz, plaintext 
  1. $sql=mysql_query("SELECT s_id,size FROM colors WHERE id='".$p."'");
[PHP] pobierz, plaintext
sebap123
12.12.2010, 17:09:29
Dobra, ten pomysł się sprawdził, w pewnym sensie. Sprawdziłem, czy zwykła komenda ruszy.
Wszystko oprócz getproduct.php zostało takie samo.
Teraz skrypt ma pobierać wartość wybranej opcji, a następnie umieszczać ją w kolejnym selekcie.

Taki jest kod gedproduct.php:
[PHP] pobierz, plaintext 
  1. $p=$_GET['pr'];
  2. echo'<option value="1">&nbsp;-&nbsp;'.$p.'</option>';
[PHP] pobierz, plaintext


No i teraz też milczy. Czyli mam podejrzewać, że AJAX nie działa?
markonix
12.12.2010, 17:09:33
Heh, nie zauważyłem tego byka, a nawet go zacytowałem wacko.gif

Edit: ogólnie to bym polecił AJAXem bawić się za pomocą jakiejś biblioteki np. jQuery.
sebap123
12.12.2010, 17:17:11
No wiem, że można bawić się bibliotekami, ale jakoś nigdy nie miałem ochoty żadnej się nauczyć. A ten cały skrypt to jest moja modyfikacja skryptu wziętego z wydaje mi się bardzo dobrej strony ->http://www.w3schools.com/PHP/php_ajax_database.asp
No i albo ja coś zupełnie poplątałem, albo tego nie da się przerobić (tutaj już wątpię, żeby się nie dało).
CuteOne
12.12.2010, 17:56:24
Może najpierw odpal plik PHP bez AJAXA i sprawdź czy nie wywali błędów
sebap123
14.12.2010, 18:59:41
Tak jak poleciłeś, sprawdziłem plik PHP bez AJAXA.No wszytko działa. Dodam tylko, że nieco pozmieniałem kod, żeby był w miarę prosty, żeby móc stwierdzić, gdzie leży błąd.
Teraz kod wygląda tak:
getproduct.php
[PHP] pobierz, plaintext 
  1. <?
  2. if($_GET['pr']==1){
  3. $p=$_GET['pr'];
  4. echo'Zmienna wynosi '.$p.'';}
  5. else{
  6. echo'brak zmiennej';
  7. }
  8. ?>
[PHP] pobierz, plaintext


plik w którym jest AJAX (nazwałem go testowa.html (a tak na marginesie, czy mogę też uruchomić AJAXA w plikach z rozszerzeniem php?):
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  5. <script type="text/javascript">
  6. function showColor(nr)
  7. {
  8. 	if(window.XMLHttpRequest){
  9. 		xmlhttp = new XMLHttpRequest();
  10. 	}
  11. 	else{
  12. 		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  13. 	}
  14. xmlhttp = new onreadystatechange = function()
  15. 	{
  16. 		if(xmlhttp.readyState==4 && xmlhttp.status==200){
  17. 			document.getElementById("selector2").innerHTML=xmlhttp.responseText;
  18. 		}
  19. 	}
  20. xmlhttp.open("GET","getproduct.php?pr="+nr,true);
  21. xmlhttp.send();
  22. }
  23. </script>
  24. <title>Untitled Document</title>
  25. </head>
  26.  
  27. <body>
  28. <div class="selector2">
  29. 					<label for="rozmiar">rozmiar:</label>
  30. 					<select name="rozmiar" id="selector_r" onchange="showColor(this.value)">
  31. 						<option value="0"></option>
  32.                         <option value="1">czarny</option>
  33. 						<option value="2">marka1</option>
  34. 					</select>
  35. 				</div>
  36.  
  37. 				<div id="selector2">
  38. 					<b>tekścik</b>
  39. 				</div>
  40. </body>
  41. </html>
[HTML] pobierz, plaintext


Może, teraz ktoś mi coś pomoże, bo ja jeszcze nie umiem na tyle dobrze JavaScript, żeby móc coś samemu orzec.
cycofiasz
14.12.2010, 19:33:03
Zamień:

xmlhttp = new onreadystatechange

Na:

xmlhttp.onreadystatechange


Polecam Ci zaglądać w konsolę błędów w przeglądarce oraz zainstalować sobie firebuga
sebap123
14.12.2010, 19:46:37
Dzięki wielkie. Teraz już działa. A teraz powiedz mi jeszcze jedno, czy jak chcę mieć jakiś efekt (np. rozsuwanie się tekstu czy jakiś błysk, no cokolwiek) to wtedy muszę użyć jQuery, czy sam też mogę coś takiego napisać?
Dobra może średnio dobrze zadane pytanie. Chodzi mi o to, czy napisanie własnych takich efektów jest rzeczą trudną, czy bardzo trudną (może lepiej będzie użyć słowa - pracochłonną.)
Po drugie, czy jest jakaś różnica, jeśli ten skrypt umieszczę nie bezpośrednio w kodzie, tylko przez dopisanie

<script type="text/javascript" src="ścieżka_do_skryptu"></script>

No i jeśli jeszcze mogę się spytać o coś, to powiedz mi czy mogę podobny kod umieścić w pliku o rozszerzeniu php a nie html jak teraz zrobiłem?

A co do konsoli błędów i firebuga, to muszę powiedzieć, że słyszałem już takie rady, ale ja używam Chrome i średnio nawet wiem, czy coś takiego już jest dla Chrome. Tak więc jakby ktoś miał jakieś info co do tego to będę wdzięczny.
cycofiasz
14.12.2010, 19:54:45
Co do efektów to można znaleźć w sieci gotowe funkcje (niekoniecznie wielkie frameworki typu jQuery). Napisanie samemu takowych nie jest zbyt skomplikowane ale wymaga dobrej znajomości css i js.
Co do <script type="text/javascript" src="ścieżka_do_skryptu"></script> to nie ma różnicy (zakładając że wszystko jest poprawnie).
Rozszerzenie pliku pobieranego przez ajax nie ma znaczenia.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.