Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> Ajax i JS, hover nie działa na tabelce zrobionej za pomocą ajaxa
nc715
post
Post #1





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 16.08.2012

Ostrzeżenie: (0%)
-----

Witam,
zacząłem właśnie stosować ajaxa i na dzień dobry mam problem smile.gif

poniżej jest funkcja która działa dobrze łączy się z bazą i wyświetla tabelkę. ( w pliku wyszukaj_produkt.php jest łączenie z bazą i wypisanie tabelki )

[PHP] pobierz, plaintext 
  1. function wyszukajProdukt() {
  2.   var adres_url = "include/wyszukaj_produkt.php";
  3.   var parametry = "wyrazenie=" + encodeURI(document.getElementById('wyrazenie').value);
  4.   mojeZadanie.open("POST", adres_url, true);
  5.   mojeZadanie.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  6.   mojeZadanie.setRequestHeader("Content-length", parametry.length);
  7.   mojeZadanie.setRequestHeader("Connection", "close");
  8.   mojeZadanie.onreadystatechange = wyniki;
  9.   mojeZadanie.send(parametry);
  10. }
  11.  
  12. function wyniki() {
  13.   if (mojeZadanie.readyState == 4) {
  14.     if(mojeZadanie.status == 200) {
  15.        wynik = mojeZadanie.responseText;
  16.        document.getElementById('tabela_produkty').innerHTML = wynik;
  17.     } else {
  18.       document.getElementById('tabela_produkty').innerHTML = '<img src="images/ajax-ladowanie.gif"/>';
  19.     }
  20.   }
  21. }
[PHP] pobierz, plaintext


Problem jest gdy chcę zrobić coś na tej tabelce za pomocą js.

[PHP] pobierz, plaintext 
  1. $("#tabela_produkty tr").hover(function(){$(this).addClass("active");},function(){$(this).removeClass("active");});
[PHP] pobierz, plaintext


i nie działa, js nie widzi tej tabelki w ogóle, chociaż na ekranie jest wyświetlona
co robię źle, może to nie ma prawa działać? i jak to ewentualnie zrobić

Pozdrawiam serdecznie
Go to the top of the page
+Quote Post
erix
post
Post #2





Grupa: Moderatorzy
Postów: 15 467
Pomógł: 1451
Dołączył: 25.04.2005
Skąd: Szczebrzeszyn/Rzeszów
A cały kod? Bez kontekstu, to możemy sobie gdybać.

Najlepiej na jsFiddle.


--------------------

ZCE :: Pisząc PW załączaj LINK DO TEMATU i TYLKO w sprawach moderacji :: jakiś błąd - a TREŚĆ BŁĘDU? :: nie ponaglaj z odpowiedzią via PW!
Go to the top of the page
+Quote Post
nc715
post
Post #3





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 16.08.2012

Ostrzeżenie: (0%)
-----

nie da rady na jsFiddle bo w kodzie jest php

index.php

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  3.  
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/xml; charset=utf-8" />
  6. <meta http-equiv="Content-Language" content="pl" />
  7. <link rel="stylesheet" type="text/css" href="css/styles.css" />
  8. <script type="text/javascript" src="js/jquery.min.js"></script>
  9.  
  10. </head>
  11. <body>
  12.  
  13. <script type="text/javascript">
  14. function pobierzZadanieXMLHTTP() {
  15.    var zadanie =  false;
  16.    try {
  17.       /* dla przeglądarki Firefox */
  18.       zadanie = new XMLHttpRequest();
  19.    } catch (blad) {
  20.       try {
  21.          /* dla niektórych wersji przeglądarki IE */
  22.          zadanie = new ActiveXObject("Msxml2.XMLHTTP");
  23.       } catch (blad) {
  24.          try {
  25.             /* dla pozostałych wersji przeglądarki IE */
  26.             zadanie = new ActiveXObject("Microsoft.XMLHTTP");
  27.          } catch (blad) {
  28.             zadanie = false;
  29.          }
  30.      }
  31.    }
  32.    return zadanie;
  33. }
  34.  
  35. function wyszukajProdukt() {
  36.   var adres_url = "include/wyszukaj_produkt.php";
  37.   var parametry = "wyrazenie=" + encodeURI(document.getElementById('wyrazenie').value);
  38.   mojeZadanie.open("POST", adres_url, true);
  39.   mojeZadanie.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  40.   mojeZadanie.setRequestHeader("Content-length", parametry.length);
  41.   mojeZadanie.setRequestHeader("Connection", "close");
  42.   mojeZadanie.onreadystatechange = wyniki;
  43.   mojeZadanie.send(parametry);
  44. }
  45.  
  46. function wyniki() {
  47.   if (mojeZadanie.readyState == 4) {
  48.     if(mojeZadanie.status == 200) {
  49.        wynik = mojeZadanie.responseText;
  50.        document.getElementById('tabela_produkty').innerHTML = wynik;
  51.     } else {
  52.       document.getElementById('prezentacjawynikow').innerHTML = '<img src="images/ajax-ladowanie.gif"/>';
  53.     }
  54.   }
  55. }
  56.  
  57. var mojeZadanie = pobierzZadanieXMLHTTP();
  58. </script>
  59. <form action="" method="post">
  60. 	<input type="text" id="wyrazenie" name="wyrazenie" />
  61. 	<input type="button" value="wyślij" onclick="java script:wyszukajProdukt();" />
  62. </form>
  63. <table id="tabela_produkty"></table>
  64.  
  65.  
  66. <script type="text/javascript">
  67. $("#tabela_produkty tr").hover(function(){$(this).addClass("active");},function(){$(this).removeClass("active");});
  68. </script>
  69. <?php
  70. </body>
  71. </html>
  72.  
[HTML] pobierz, plaintext


a plik wyszukaj_produkt.php :
[PHP] pobierz, plaintext 
  1. $db = db_connect();
  2.  
  3. $zapytanie = "select * from produkty where produkt like '%".$wyrazenie."%'";
  4. $wynik = $db->query($zapytanie);
  5.  
  6. while ($wiersz = $wynik->fetch_assoc()) {
  7.    echo "<tr><td>".$wiersz['produkt_id']."</td><td>".$wiersz['produkt']."</td></tr>";
  8. }
[PHP] pobierz, plaintext
Go to the top of the page
+Quote Post
nospor
post
Post #4





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004
Przecież o to:
$("#tabela_produkty tr").hover(function(){$(this).addClass("active");},function(){$(this).removeClass("active");});
wykona się dużo wcześniej niż załaduje się tabelka w AJAX więc nie ma się dziwić że ci to nie działa, skoro to operuje na tabeli, której jeszcze nie ma....


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer
Go to the top of the page
+Quote Post
nc715
post
Post #5





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 16.08.2012

Ostrzeżenie: (0%)
-----

czyli co mam zrobić, aby takie coś działało? arrowheadsmiley.png
Go to the top of the page
+Quote Post
nospor
post
Post #6





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004
No nie wiem.... może trochę pomyślećquestionmark.gif
Skoro przed pojawieniem się to zły pomysł, to moze warto wykonywać ten kod po pojawieniu się tabeli?


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer
Go to the top of the page
+Quote Post
erix
post
Post #7





Grupa: Moderatorzy
Postów: 15 467
Pomógł: 1451
Dołączył: 25.04.2005
Skąd: Szczebrzeszyn/Rzeszów
Zacząć myśleć i zrozumieć własny kod.

Podpowiedź: jest wykonywany od góry do dołu.


--------------------

ZCE :: Pisząc PW załączaj LINK DO TEMATU i TYLKO w sprawach moderacji :: jakiś błąd - a TREŚĆ BŁĘDU? :: nie ponaglaj z odpowiedzią via PW!
Go to the top of the page
+Quote Post
nc715
post
Post #8





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 16.08.2012

Ostrzeżenie: (0%)
-----

dzieki...
Go to the top of the page
+Quote Post
nospor
post
Post #9





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004
erix twoja podpowiedź jest nie prawidłowa. Co z tego że od góry do dołu? Wg takiego schematu to jego kod powinien działać. A nie działa, bo AJAX wykonuje się dłużej, dlatego kod, który jest poniżej, i tak wykonuje się przed zwrotem AJAX, który jest powyżej.

@autor: daj ten kod albo w kodzie zwracanym z ajax, albo podepnij się pod zdarzenie kończące ajax


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer
Go to the top of the page
+Quote Post
nc715
post
Post #10





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 16.08.2012

Ostrzeżenie: (0%)
-----

Cytat(nospor @ 16.08.2012, 16:03:35 ) *
daj ten kod albo w kodzie zwracanym z ajax, albo podepnij się pod zdarzenie kończące ajax


zadziałało jak się podpiąłem pod zdarzenie końcowe ajax

Problem rozwiązany

Dzięki nospor smile.gif
Go to the top of the page
+Quote Post
« Następny starszy · XML, AJAX · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 21.08.2025 - 19:46
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn