Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JavaScript][Ajax] wczytywanie danych z pliku
sznurkowa
post 12.08.2013, 12:11:36
Post #1





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 12.08.2013

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

Witam, jestem początkująca i nie radzę sobie ze znalezionym przykładem.
Mam plik index.html, ajax.js i dane.php

mój index to
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  2.   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl"> 
  4. <head lang="pl">
  5.   <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
  6.   <script type="text/javascript" src="ajax.js"></script>
  7. </head>
  8. <body>
  9.         <ul id="trans-nav">
  10.                 <li><a href="#" onClick="callwykres('dane.php', 'zawartosc', 'Trwa ładowanie strony...')">STRONA GŁÓWNA</a></li>
  11.         </ul>
  12.         <div id="zawartosc">
  13.                <li><a href="#" onClick="callwykres('dane.php', 'zawartosc', 'Trwa ładowanie strony...')">test</a></li> <h2> Tutaj zostanie wczytana treśœć pliku dane.php</h2>
  14.         </div>
  15. </body>
  16. </html>
[HTML] pobierz, plaintext


mój ajax.js
[PHP] pobierz, plaintext 
  1. function getXMLHTTPRequest() {
  2. try {
  3.         req=new XMLHttpRequest(); /* np. Firefox */
  4. }       catch(err1) {
  5.         try     {
  6.                 req=new ActiveXObject("Msxm12.XMLHTTP"); /* niektóre wersje IE */
  7.         }       catch(err2) {
  8.                 try {
  9.                         req=new ActiveXObject("Microsoft.XMLHTTP"); /* niektóre wersje IE */
  10.                 }       catch(err3) {
  11.                         req=false;
  12.                 }
  13.         }
  14. }
  15. return req;
  16. }
  17. /* WCZYTYWANIE PODSTRON */
  18. var http=getXMLHTTPRequest();
  19. function callwykres(url, pageElement, callMessage) {
  20.         document.getElementById(pageElement).innerHTML = callMessage;
  21.         myRand=parseInt(Math.random()*9999999999);
  22.         var myurl=url + "?rand=" + myRand;  
  23.         http.open("GET",myurl,true);
  24.         http.onreadystatechange = function() {responsewykres(pageElement);};
  25.         http.send(null);
  26. }
  27. function responsewykres(pageElement) {
  28.         if(http.readyState == 4) {
  29.                 if(http.status == 200) {
  30.                         var output = http.responseText;
  31. document.getElementById(pageElement).innerHTML = output;
  32.                 }
  33.         }
  34. }
[PHP] pobierz, plaintext


dane.php
[PHP] pobierz, plaintext 
  1. <?php
  2. header("Content-type: text/html; charset=iso-8859-2");
  3. ?>
  4.  
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  6.   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  7. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">       
  8. <head lang="pl">
  9.   <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
  10. </head>
  11. <body>
  12.    <h1> To są dane wczytana z pliku PHP </h1>
  13. </body>
  14. </html>
[PHP] pobierz, plaintext

Nie wczytuje mi nic, mam tylko ładowanie (napis).
Chcę wczytywać dane z pliku na przykład txt i rysować później wykres funkcją javascript, która mi działa, ale w innym pliku testowym jak podpinam jquery.js i jquery.flot.js

Nie wiem dlaczego nie wczytuje mi napisu z pliku dane.php i jak powiązać rysowanie wykresu w moim pliku index.html
[PHP] pobierz, plaintext 
  1. $(function () {
  2.     var d1 = [[17263.9, 25], [17265, 25], [12466, 99], [17267, 99]];
  3. 	var d2 = [[17244.905,88],[17245,185], [17248.395,73],[17248.395,79]];
  4. 	$.plot($("#placeholder"), [ d1, d2 ]);
  5. });
[PHP] pobierz, plaintext


Tylko te dane chciałabym zaczytywać z pliku i wrzucać do dwóch serii danych.

Ten post edytował sznurkowa 12.08.2013, 12:13:46
Go to the top of the page
+Quote Post
b4rt3kk
post 12.08.2013, 12:46:21
Post #2





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

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

Nie wiem czy jest sens utrudniać sobie życie stosując czystego JS-owego Ajaxa, skoro można użyć biblioteki jQuery i zrobić to o wiele prościej. Ale z tego co mówisz, skoro funkcja rysująca wykres potrzebuje bibliotek jQuery do działania, to musisz je podpiąć w swoim pliku index w sekcji HEAD.



--------------------
Jeśli pomogłem, kliknij proszę 'pomógł'. Dzięki.
Go to the top of the page
+Quote Post
sznurkowa
post 12.08.2013, 12:55:35
Post #3





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 12.08.2013

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

Cytat(b4rt3kk @ 12.08.2013, 12:46:21 ) *
Nie wiem czy jest sens utrudniać sobie życie stosując czystego JS-owego Ajaxa, skoro można użyć biblioteki jQuery i zrobić to o wiele prościej. Ale z tego co mówisz, skoro funkcja rysująca wykres potrzebuje bibliotek jQuery do działania, to musisz je podpiąć w swoim pliku index w sekcji HEAD.

Tak mam, ale to nie działa.
[PHP] pobierz, plaintext 
  1. <script language="javascript" type="text/javascript" src="jquery.js"></script>
  2.     <script language="javascript" type="text/javascript" src="jquery.flot.js"></script>
[PHP] pobierz, plaintext

Do index.html jak w kodzie jest - podpięte.
Problem w tym, że
a) coś jest w kodzie nie tak, bo mam "trwa ładowanie...", ale nie ładuje,
b)po doklejeniu jquery i flot w head , a na dole div placeholder i skryptu z wykresem var1 i var2 nie rysuje wykresu
c) no i problem jak zaczytaj serię danych do var1 i var2 z pliku, zeby nie wpisywać na sztywno

Ubiegnę pytania, tak mam zdefiniowany placeholder:
[PHP] pobierz, plaintext 
  1. <div id="placeholder" style="width:600px;height:300px;"></div>
[PHP] pobierz, plaintext


Ten post edytował sznurkowa 12.08.2013, 13:03:34
Go to the top of the page
+Quote Post
b4rt3kk
post 12.08.2013, 13:15:04
Post #4





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

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

Przede wszystkim sprawdź sobie czy funkcja działa:

[HTML] pobierz, plaintext 
  1. function responsewykres(pageElement) {
  2. alert(http.readyState);
  3. if(http.readyState == 4) {
  4. if(http.status == 200) {
  5. var output = http.responseText;
  6. document.getElementById(pageElement).innerHTML = output;
  7. }
  8. }
  9. }
[HTML] pobierz, plaintext


--------------------
Jeśli pomogłem, kliknij proszę 'pomógł'. Dzięki.
Go to the top of the page
+Quote Post
sznurkowa
post 12.08.2013, 13:24:38
Post #5





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 12.08.2013

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

Cytat(b4rt3kk @ 12.08.2013, 13:15:04 ) *
Przede wszystkim sprawdź sobie czy funkcja działa:

[HTML] pobierz, plaintext 
  1. function responsewykres(pageElement) {
  2. alert(http.readyState);
  3. if(http.readyState == 4) {
  4. if(http.status == 200) {
  5. var output = http.responseText;
  6. document.getElementById(pageElement).innerHTML = output;
  7. }
  8. }
  9. }
[HTML] pobierz, plaintext

Nie wiem jak, widzę, tylko brak wczytywania czyli nie działa.
Te pliki mam z przykładów znalezionych prócz wykresu, ktory pisałam sama w osobnym pliku.
Widzisz lepsze rozwiązanie do wczytywania danych (kilkuset więc ręczne wpisywanie var odpada), rysowania z nich wykresu, ale nie wyrzucania tego wszystkiego na stronę, tylko podczepienia do zewnętrznych plików txt z danymi i po kliknięciu wywołania danych i wyrysowania wykresu tylko dla tej serii, którą wybierzemy?
Go to the top of the page
+Quote Post
b4rt3kk
post 12.08.2013, 13:35:43
Post #6





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

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

Proponuję byś użyła funkcji ajax z biblioteki jQuery lub możesz wczytać wszystkie dane poprzez PHP, a następnie funkcją JS wczytać je i przekazać do funkcji rysującej wykres.

W powyższej funkcji dodałem alerta, który miał wyświetlić stan wczytywania pliku (jeśli nic się nie pojawia, to znaczy że funkcja w ogóle nie jest uruchamiana).

Dorzuć sobie jQuery do HEAD strony i dopisz taki prosty skrypcik:

[HTML] pobierz, plaintext 
  1. $(function(){
  2.   $.ajax({
  3.     url: "plik.php",
  4.     success: function(msg) {
  5.       alert(msg);
  6.     }
  7. });
[HTML] pobierz, plaintext


Ten post edytował b4rt3kk 12.08.2013, 13:38:53


--------------------
Jeśli pomogłem, kliknij proszę 'pomógł'. Dzięki.
Go to the top of the page
+Quote Post
sznurkowa
post 13.08.2013, 08:31:43
Post #7





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 12.08.2013

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

Cytat(b4rt3kk @ 12.08.2013, 13:35:43 ) *
Proponuję byś użyła funkcji ajax z biblioteki jQuery lub możesz wczytać wszystkie dane poprzez PHP, a następnie funkcją JS wczytać je i przekazać do funkcji rysującej wykres.

W powyższej funkcji dodałem alerta, który miał wyświetlić stan wczytywania pliku (jeśli nic się nie pojawia, to znaczy że funkcja w ogóle nie jest uruchamiana).

Dorzuć sobie jQuery do HEAD strony i dopisz taki prosty skrypcik:

[HTML] pobierz, plaintext 
  1. $(function(){
  2.   $.ajax({
  3.     url: "plik.php",
  4.     success: function(msg) {
  5.       alert(msg);
  6.     }
  7. });
[HTML] pobierz, plaintext

Spróbuję zrobić jak piszesz i odezwę się co wyszlo, dzięki.


To nie da rady..bo chcę wczytywać te dane, a okazuje się, że powinny być bezpośrednio z bazy czytane.
Jak to powinno wyglądać ?
- plik html z miejscem wywołania wykresu, w sekcji head podpięty javascript
- plik flot z jquery w tym samym katalogu co html
- plik jakiś config.php do łączenia się do bazy MDB_NAME, *_USER, *_PASS, ale jak wydobyć z tej bazy za pomocą select dane i jak przekazać do czytania do wykresu.

Znalazłam taki fragment, który czytałby mi z bazy
[PHP] pobierz, plaintext 
  1. <?PHP
  2.  
  3. $sql_host = &#8218;nazwa_hosta’;
  4. $sql_user = &#8218;nazwa_uzytkownika’;
  5. $sql_user = &#8218;haslo’;
  6. $sql_baza = &#8218;nazwa_bazy_danych’;
  7.  
  8. if (mysql_connect($sql_host, $sql_user, $sql_password) and mysql_select_db($sql_baza)) {
  9.  
  10. mysql_close();
  11. }
  12.  
  13. ?>
[PHP] pobierz, plaintext


Tylko nie wiem co dalej gdyby coś przeczytał.
Go to the top of the page
+Quote Post
b4rt3kk
post 13.08.2013, 09:20:39
Post #8





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

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

Ten fragment kodu pozwoli Ci jedynie połączyć się z bazą danych. Musisz jeszcze napisać zapytanie do bazy i je wykonać i dopiero wtedy wyświetlić wyniki.


--------------------
Jeśli pomogłem, kliknij proszę 'pomógł'. Dzięki.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · 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 Wersja Lo-Fi Aktualny czas: 7.06.2025 - 10:21
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn