Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [AJAX][PHP][jQuery]
Forum PHP.pl > Forum > Przedszkole
gawar
Witam,
Od jakiegoś czasu borykam się z problem wyciągnięcia danych z bazy MySQL za pomocą jQuery i AJAXa.
Dane chciałbym pobierać w momencie gdy użytkownik najedzie na jakiś obiekt na stronie. Napisałem do tego funkcje w jQuery:
  1. $("rect").bind("hover", function() {
  2. var identyfikator = "";
  3. if ($(this).attr("id") != null) {
  4. identyfikator = $(this).attr("id");
  5. $.ajax({
  6. url:"func_id.php",
  7. data:{"func_id": identyfikator}
  8. });
  9. $.getJSON("func_id.php", function(json) {
  10. $.each(json.result, function() {
  11. var info='sektor' + this['sektor'] + 'rzad' + this['rzad']+ 'miejsce' + this['miejsce'];
  12. alert($(this).text() + " " + info);
  13. })
  14. });
  15. });
  16. });

Moja funkcja w pliku func_id.php wygląda następująco:
  1. <?php
  2. function func_id($id_miejsce) {
  3.  
  4. require_once ('polacz.php');
  5.  
  6. $sprawdzenie = $sth->prepare('SELECT sektor, rzad,miejsce,
  7.  
  8. FROM t_miejsce
  9.  
  10. WHERE id_miejsce=:id_miejsce');
  11.  
  12. $sprawdzenie->bindValue(':id_miejsce',$id_miejsce,PDO::PARAM_INT);
  13.  
  14. $sprawdzenie->execute();
  15.  
  16.  
  17. $result = $sprawdzenie->fetchAll();
  18. $jso= json_encode(array("result"=>$result));
  19.  
  20.  
  21. return $jso;
  22. }
  23. ?>

chciałbym aby po najechaniu myszką na obiekt rect, pobrały się dane z bazy dla tego konkretnego obiektu i wyświetliły się w okienku alert. Nie wiem czy wywołanie tej funkcji w jquery jest poprawne czy samo wyświetlenie tych danych zawodzi. Jestem początkującym jeżeli chodzi o jquery i ajax dlatego bardzo proszę o pomoc.
10log
JSON co wróci z requesta trzeba by przeparsować w handlerze, który dasz np do done(callback).

  1. $.ajax({
  2. url:"func_id.php",
  3. data:{"func_id": identyfikator}
  4. }).done(function(data){
  5. //w data powinien byc json
  6. });


Druga sprawa php powinno zwrócic dane przez echo a nie return. I jeszcze wywal tą funkcje func_id a parametr $id_miejsce pobierz z $_GET bo to jest domyślna metoda wysyłania funkcji ajax.

A w ogóle to albo rób przez ajax albo getJSON smile.gif
snerf
A ja proponuję pobrać najpierw to co chcesz ukryć w divie pod danymrekordem a potem po najechaniu myszką użyć jquery show and hide.
Nie dość ze będzie działać szybciej to nie zajedziesz bazy. Tylko Niewiem czy możesz sobie pozwolić na taki sposób

Pozdrawiam
gawar
snerf to było by chyba bardzo nie optymalne rozwiązanie ładować do diva np 1000 rekordów z bazy.
10log poprawiłem, ale dalej nie chce działać. Nie mam doświadczenie w tym i nie wiem jak wyszukiwać błędów w kodzie. Może ktoś podpowie jak?

Oto kod po aktualizacji:

  1. <?php
  2.  
  3. $id_miejsce = $_GET['id_miejsce'];
  4.  
  5. require_once ('polacz.php');
  6.  
  7. $sprawdzenie = $sth->prepare('SELECT sektor, rzad,miejsce
  8.  
  9. FROM t_miejsce
  10.  
  11. WHERE id_miejsce=:id_miejsce');
  12.  
  13. $sprawdzenie->bindValue(':id_miejsce',$id_miejsce,PDO::PARAM_INT);
  14.  
  15.  
  16.  
  17. $sprawdzenie->execute();
  18.  
  19. $result = $sprawdzenie->fetchAll();
  20. echo json_encode(array("result"=>$result));
  21.  
  22.  
  23. ?>

  1. $(document).ready(function(){
  2. $("rect").bind("click", function() {
  3.  
  4. var identyfikator = "";
  5.  
  6. if ($(this).attr("id") != null) {
  7.  
  8. identyfikator = $(this).attr("id");
  9. //alert($(this).text() + " " + identyfikator);
  10. $.ajax({
  11. type:"GET",
  12. url:"func_id.php",
  13. dataType:'json',
  14. data:{"id_miejsce": identyfikator},
  15. success:function(json){
  16. var info='sektor' + this['sektor'] + 'rzad' + this['rzad']+ 'miejsce' + this['miejsce'];
  17. alert($(this).text() + " " + info);
  18. };
  19. error: function() {
  20. alert('wystąpił błąd ');
  21. };
  22.  
  23. });
  24. }
  25.  
  26. });
  27. });
Turson
Przeanalizuj żądanie AJAX'owe http://blog.turson.pl/jquery-ajax-analiza-...rkowej-konsoli/
Sprawdź co wysyłasz i co dostajesz
gawar
Testowałem tak, żądanie w ogóle nie startuje:(
viking
Żądanie się nie wysyła?
$("rect") - tu na pewno element rect a nie jakiś id?
gawar
$("rect") -tak ma być, na samym alercie to działało prawidłowo.
Forti
Wątpię aby to tak dzialalo. Tam na pewno byla . Lub #
10log
  1. success:function(json){
  2. var info='sektor' + this['sektor'] + 'rzad' + this['rzad']+ 'miejsce' + this['miejsce'];
  3. alert($(this).text() + " " + info);
  4. };
  5. error: function() {
  6. alert('wystąpił błąd ');


Po funkcji success ma być przecinek a nie średnik a po funkcji error ma już nic nie być. Nawet średnika.
Takie błędy są widoczne w konsoli.
gawar
10log - dziękuję, rzeczywiście błąd był z tym przecinkiem i średnikiem. Ale po wykonaniu funkcji czyli kliknięciu na prostokąt pojawia się alert z błędem -> alert('wystąpił błąd ');
Czyli nie ma tak oczekiwanego success... jak to rozwiązać? Czy źle odbieram dane? bo przekazuje poprawnie (według przeglądarki).
Odnośnie
Cytat
Takie błędy są widoczne w konsoli.
to możesz coś więcej napisać jak to sprawdzać?
Turson
Jak jest error to możliwe, że masz błędny adres żądania. Dałem Ci link jak sprawdzić co idzie przez AJAX, dokąd idzie, co zwraca, jaki jest status. W Firebugu (ew. F12) masz konsolę też
com
do jsona przekazujesz tablice tablic , tak ma być? smile.gif
gawar
poprawiłem tą tablice
  1. echo json_encode($result);
. Cały czas wyskakuje mi błąd. A jak patrze w konsoli to jest zawartość odpowiedzi zgodna z tym co pobieram. Dodatkowo pojawia się jeszcze ReferenceError: blad is not defined - bo dodałem console.log(blad); ale to mi nic nie mówi.

com
no bo nie ma takiej zmiennej jak blad u Ciebie
gawar
ok mój błąd. Ale i tak to nie działa cały czas pojawia się alert z error z:
  1. function() {
  2. alert('wystąpił błąd ');
  3. }
10log
Jeśli ciągle zwraca error tzn., że request się nie powiódł.

Jak używasz Chrome to wybierz menu->więcej narzędzi->narzędzia dla programistów, pokaże Ci się fajne narzędzie, gdzie możesz sprawdzić co się dzieje.
Wybierz zakładkę network, przeładuj stronę i zobaczysz wszystkie requesty. Zaznaczone na czerwono to te, które się nie powiodły. Znajdź swój i zobacz co tam jest napisane.

W Firefox ktoś już Ci podpowiedział F12, nawet IE ma narzędzia dla programistów, też pod F12.
gawar
Wydaje mi się że się powiódł...tylko problem może jest z wyświetleniem tych danych.
To wypluwa konsola.
Zawartość odpowiedzi Δ0ms
 [{"sektor":"1","rzad":"1","miejsce":"1"}]
a cała funkcja wygląda tak:
  1. $(document).ready(function(){
  2. $("rect").bind("click", function() {
  3.  
  4. var identyfikator = "";
  5.  
  6. if ($(this).attr("id") != null) {
  7.  
  8. identyfikator = $(this).attr("id");
  9. //alert($(this).text() + " " + identyfikator);
  10. $.ajax({
  11. type:"GET",
  12. url:"./func_id.php",
  13. dataType:"json",
  14. data:{"id_miejsce": identyfikator},
  15. success : function(json){
  16.  
  17.  
  18.  
  19. alert( json['sektor'] + "\n" + json['rzad']+ "\n" + json['miejsce']);
  20. },
  21. error: function() {
  22. alert('wystąpił błąd ');
  23.  
  24. }
  25.  
  26. });
  27. }
  28.  
  29. });
  30. });
10log
Skoro w odpowiedzi dostajesz [{"sektor":"1","rzad":"1","miejsce":"1"}] to może json[0]['sektor']?
gawar
tak też nie działa. Pewnie jest to jakaś pierdoła:(
10log
Ja się trochę pogubiłem. W tym momencie co nie działa? Ciągle skacze Ci do hadnlera error, czy źle parsuje wynik?

Przykład trochę okrojonego Twojego wywołania i jak to się mówi "u mnie działa".

  1. $(document).ready(function(){
  2. $.ajax({
  3. type:"GET",
  4. url:"dup.php",
  5. dataType:"json",
  6. success : function(json){
  7. console.log(json[0]['raz']);
  8. },
  9. error: function() {
  10. alert('wystąpił błąd ');
  11. }
  12. });
  13. });
gawar
Ciągle skacze do hadnlera error
10log
No to tak jak napisałem wcześniej. Chrome menu->więcej narzędzi->narzędzia dla programistów->zakładka network (albo Firefox F12).
trueblue
zmień funkcję error na:
  1. error: function(xhr,status,error){
  2. console.log(status,error);
  3. alert('wystąpił błąd ');
  4. }

i pokaż co wyświetla konsola.
gawar
GET http://cmgserwer/go/func_id.php [HTTP/1.1 200 OK 1ms]
"parsererror" SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
Ślad stosu:
n.parseJSON@http://cmgserwer/go/jquery-2.1.3.min.js:4:5304
uc@http://cmgserwer/go/jquery-2.1.3.min.js:4:7333
x@http://cmgserwer/go/jquery-2.1.3.min.js:4:10747
.send/b/<@http://cmgserwer/go/jquery-2.1.3.min.js:4:14577
trueblue
"parsererror" SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
gawar
Trochę tego nie rozumiem, bo w odpowiedzi w konsoli dostaje coś takiego [{"sektor":"1","rzad":"9","miejsce":"10"}] Według mnie te dane wyglądają prawidłowo.
To dlaczego cały czas handler przenosi mnie do error? Rozumiem, że jest błąd. Ale jak go wyłapać?
mój plik pobierający dane wygląda następująco
  1. <?php
  2. //ini_set( 'display_errors', 'On' );
  3.  
  4. //error_reporting( E_ALL );
  5.  
  6. $id_miejsce = $_GET['id_miejsce'];
  7.  
  8. require_once ('polacz.php');
  9.  
  10. $sprawdzenie = $sth->prepare('SELECT sektor, rzad, miejsce
  11.  
  12. FROM t_miejsce
  13.  
  14. WHERE id_miejsce=:id_miejsce');
  15.  
  16.  
  17.  
  18. $sprawdzenie->bindValue(':id_miejsce',$id_miejsce,PDO::PARAM_INT);
  19.  
  20.  
  21.  
  22. $sprawdzenie->execute();
  23.  
  24.  
  25.  
  26. $result = $sprawdzenie->fetchAll(PDO::FETCH_ASSOC);
  27.  
  28. echo json_encode($result);
  29.  
  30.  
  31.  
  32. ?>
  33.  

johny_s
ustaw odpowiednie nagłówki
trueblue
Zakoduj plik php w UTF-8 bez BOM i wyślij header przed danymi:
  1. header('Content-type: application/json; charset=utf-8');

gawar
Dzięki problem był z kodowaniem
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.