Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][AJAX] Wyświetlanie 5 ostatnich wpisów
Forum PHP.pl > Forum > Przedszkole
Lethys
20.07.2012, 22:40:02
Chcę napisać w ajaxie wyświetlanie 5 ostatnich wpisów z bazy.

Obecnie działa wszystko ok, odświeża mi wynik co pół sekundy ale wyświetla tylko jeden wynik a chcę wyświetlać 5 ostatnich.

Kod:

Zapytanie do bazy:

[PHP] pobierz, plaintext 
  1. $result = mysql_query("SELECT * FROM $tableName order by data limit 5");  
[PHP] pobierz, plaintext



Klient:

[PHP] pobierz, plaintext 
  1.  
  2. <!---------------------------------------------------------------------------------------------
  3. Example client script for JQUERY:AJAX -> PHP:MYSQL example
  4. by Trystan Lea : openenergymonitor.org : GNU GPL
  5.  
  6. I recommend going to <a href="http://jquery.com/" target="_blank">http://jquery.com/</a> for the great documentation there about all of this
  7. ---------------------------------------------------------------------------------------------->
  8. <html>
  9.   <head>
  10.     <script language="javascript" type="text/javascript" src="jquery.js"></script>
  11.   </head>
  12.   <body>
  13.  
  14.   <!---------------------------------------------------------------------------------------------
  15.   1) Create some html content that can be accessed by jquery
  16.   ---------------------------------------------------------------------------------------------->
  17.   <h2> Client example </h2>
  18.   <h3>Output: </h3>
  19.   <div id="output">this element will be accessed by jquery and this text will be replaced</div>
  20.  
  21.   <script id="source" language="javascript" type="text/javascript">
  22.  
  23.   setInterval(function () 
  24.   {
  25.  
  26.  
  27.     //-------------------------------------------------------------------------------------------
  28.     // 2) Send a http request with AJAX <a href="http://api.jquery.com/jQuery.ajax/" target="_blank">http://api.jquery.com/jQuery.ajax/</a>
  29.     //-------------------------------------------------------------------------------------------
  30.     $.ajax({                                      
  31.       url: 'api.php',                  //the script to call to get data          
  32.       data: "",                        //you can insert url argumnets here to pass to api.php for example "id=5&parent=6"
  33.       dataType: 'json',                //data format      
  34.       success: function(data)          //on recieve of reply
  35.       {
  36.         var id = data[0];              //get id
  37.         var vname = data[1];           //get name
  38.         //--------------------------------------------------------------------------------------
  39.         // 3) Update html content
  40.         //--------------------------------------------------------------------------------------
  41.         $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);     //Set output element html
  42.  
  43.         //recommend reading up on jquery selectors they are awesome <a href="http://api.jquery.com/category/selectors/" target="_blank">http://api.jquery.com/category/selectors/</a>
  44.       } 
  45.     });
  46.  
  47.   },500); 
  48.  
  49.   </script>
  50.  
  51.   </body>
  52. </html>  
  53.  
  54.  
[PHP] pobierz, plaintext



Jak mogę zrobić aby mi wyświetlało 5 ostatnich wpiów z bazy nie tylko jeden?

vifus
20.07.2012, 22:55:08
Według mnie trochę źle to robisz, ja bym to zrobił w ten sposób:

najpierw robisz plik odświez.js a w nim: 

[XML] pobierz, plaintext 
  1. onload = function() {
  2.  
  3. var intervalID = window.setInterval(showPart, 1000, 1);
  4.  
  5. function showPart(str)
  6. {
  7. xmlhttp=GetXmlHttpObject();
  8. var url="baza.php";
  9. url=url+"?part="+str;
  10. url=url+"&sid="+Math.random();
  11. xmlhttp.onreadystatechange=stateChanged;
  12. xmlhttp.open("GET",url,true);
  13. xmlhttp.send(null);
  14. }
  15.  
  16. function stateChanged()
  17. {
  18. if (xmlhttp.readyState==4)
  19. {
  20. document.getElementById("informacja").innerHTML=xmlhttp.responseText;
  21. }
  22. }
  23.  
  24. function GetXmlHttpObject()
  25. {
  26. if (window.XMLHttpRequest)
  27.  {
  28.  return new XMLHttpRequest();
  29.  }
  30. return null;
  31. }
  32.  
  33. }
[XML] pobierz, plaintext


w plik baza.php :


[PHP] pobierz, plaintext 
  1. $wynik = mysql_query("SELECT * FROM baza")
  2. or die('Błąd zapytania');
  3.  
  4. if(mysql_num_rows($wynik) > 0) {
  5.  
  6.     while($r = mysql_fetch_assoc($wynik)) {
  7.  
  8.     echo $r['id'];
  9.     }
  10.  
  11. }
  12.  
  13.  
[PHP] pobierz, plaintext


i później tam gdzie chcesz wyświetlić te rekordy w head dajesz:

<script type="text/javascript" src="odswiez.js"></script>

i tam gdzie chcesz mieć wyświetlone rekordy dajesz sobie taki div <div id="informacja"></div>

I wszystko śmiga.
Rysh
20.07.2012, 23:07:14
Cytat(Lethys @ 20.07.2012, 23:40:02 ) *
Obecnie działa wszystko ok, odświeża mi wynik co pół sekundy

Wiesz, że zabijesz tym bazę?
vifus
20.07.2012, 23:11:24
sam korzystam z tego rozwiązania, co podałem i jest ok, baza jest na jakimś serwerze www za sms i nie zabija jej.
Lethys
20.07.2012, 23:16:26
Super działa, mam jeszcze pytanie. Dałoby się jakoś zrobić aby przy wykryciu nowego rekordu odgrywało dźwięk?

Czyli skrypt się odświeża i jest nowy rekord który wyświela + dodatkowo odgrywa dźwięk.
vifus
20.07.2012, 23:19:56
w php nie odtworzysz żadnego dźwięku wink.gif
Lethys
21.07.2012, 00:07:38
No w php nie ale może da się w js bądź html. Wiem, że jest audio w HTML5 ale nie wiem czy będzie się dało odtowrzyć automatycznie dźwięk nowym wpisie.

Chodzi mi o coś takiego jak na facebookowym czacie.

Czyli jest nowy wpis w bazie = odtworzenie dzwieku.
sunpietro
21.07.2012, 06:49:47
możesz dać event dźwiękowy za pomocą HTML5 Audio API.
Lethys
21.07.2012, 10:36:38
Zrobiłem dźwięk w audio HTML5, na localhoscie wszystko działa tak jak należy.

po wrzuceniu na serwer, dźwięk się nie odtwarza.

Czy działanie HTML5 zalezy od serwera, czy przeglądarki? Czemu na serwerze mi nie działa?
drozdii07
21.07.2012, 11:14:13
Moja szklana kula mówi: Może zapomniałeś wrzucić pliku audio na serwer ?
Lethys
21.07.2012, 11:42:59
Cytat(drozdii07 @ 21.07.2012, 10:14:13 ) *
Moja szklana kula mówi: Może zapomniałeś wrzucić pliku audio na serwer ?


Też na to wpadłem ale wrzuciłem smile.gif
drozdii07
21.07.2012, 11:50:43
Daj jakiś przykład live. Sprawdź też w konsoli(w Chrome przycisk F12) dla Firefoxa polecam Firebug. Może źle wpisana jest jakaś ścieżka ?
Lethys
21.07.2012, 12:57:00
Ok działa, problemem była przeglądarka.

Dizłałem na firefoxie (14.0.1) i tam dźwięk niestety nie działał, po sprawdzeniu kodu w Chrome wszystko działa.

Jako, że kod i sygnały dźwiekowe mają byćtylko do mojego użytku to multiprzeglądarkowość nie jest dla mnie problemem smile.gif
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.