Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [ajax howto] Jeszcze prostszy AJAX: moo.ajax, Prościej niż AdvAjax - najprościej ;-)
Fipaj
post 14.04.2006, 14:23:52
Post #1





Grupa: Zarejestrowani
Postów: 691
Pomógł: 0
Dołączył: 19.01.2005
Skąd: Warszawa

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

OK, trzeba się zrehabilitować ;-) Oto opis praktycznie najprostszego silniczka do obsługi Ajaksu ;-)

Co będzie potrzebne?
Potrzebne będą dwa skrypty - moo.ajax i prototype.lite. Oba można pobrać z mojego serwera: http://fipaj.livenet.pl/files/AJAX.tar.gz (naprawiony!)

Zaczynamy
Paczkę rozpakowywujemy i przenosimy na serwer (!). Aplikacja nie zadziała z protokołu file://, musimy umieścić ją na serwerze z obsługą php.
Nasza aplikacja będzie składać się z czterech plików:
* script.php
* index.html
* moo.ajax.js
* prototype.lite.js
Wszystkie przykłady znajdują się w w/w paczce.

Po stronie serwera
Plik script.php ma coś wypisywać na ekranie. Mogą to być dane z bazy bądź z pliku - to akurat nie jest ważne. W naszym przykładzie będzie to wyglądać tak:
[PHP] pobierz, plaintext 
  1. <?php
  2. sleep (10);
  3. print ("Jestem skryptem");
  4. ?>
[PHP] pobierz, plaintext

Skrypt zasypia na 10 sekund, po czym wyświetla napis "Jestem skryptem".
Ten pliczek można sobie dowolnie rozbudowywać, to chyba każdy umie ;-)

Po stronie przeglądarki
Skrypt moo.ajax to klasa o nazwie "ajax", którą wywołujemy z następującymi parametrami:
* url - adres url skryptu, tutaj script.php
* options [parametry] - o tym za chwilę
Wywołanie połączenia wygląda więc tak:
Kod
new ajax (url, options);

OK, co z tymi parametrami? Przede wszystkim podajemy je w tablicy, tak to wygląda w JS:
Kod
new ajax ('script.php', {klucz1: 'wartość', klucz2: 'wartość',...);

Proste? Proste.
Oto spis możliwych parametrów:
* 'method' -> post bądź get, domyślnie post
* 'postBody' -> parametry połączenia post
* 'onComplete' -> nazwa funkcji wykonywanej po wykonaniu połączenia Ajaksu
* 'update' -> id elementu, który zostanie wypełniony treścią pobraną z pliku php
OK, teraz cały plik index.html:
[HTML] pobierz, plaintext 
  1. <html>
  2.       <head>
  3.             <title>Ajax!</title>
  4.             <script src="prototype.lite.js"></script>
  5.             <script src="moo.fx.js"></script>
  6.             <script src="moo.ajax.js"></script>
  7.             <script>
  8. window.onload = function () {
  9.       new ajax ('php.php', {update: $('tekst'), onComplete: myFunction});
  10. }
  11. function myFunction(request){
  12.   alert(request.responseText);
  13. }
  14.             </script>
  15.       </head>
  16.       <body>
  17.             <h1>Ajax Test! :)</h1>
  18.             <p id="tekst">Ten tekst za chwilę zostanie zastąpiony przez inny ;-)</p>
  19.       </body>
  20. </html>
[HTML] pobierz, plaintext


Zakończenie
Dziękuję za uwagę ;-) A tutaj strona główna skryptu: http://www.mad4milk.net/entry/moo.ajax

Ten post edytował Fipaj 14.04.2006, 15:08:57


--------------------
Mój skromy blog ;-)
Go to the top of the page
+Quote Post
GrayHat
post 14.04.2006, 14:41:36
Post #2





Grupa: Zarejestrowani
Postów: 566
Pomógł: 18
Dołączył: 23.08.2003
Skąd: Łomża

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

hehe wczesniej odkrylem ten silnik smile.gif
przyklad na stronie ktora robie dla klienta: www.kfl.pl


--------------------
*Note: No animals were killed durning the construction of this post.
Go to the top of the page
+Quote Post
TomASS
post 14.04.2006, 23:03:25
Post #3





Grupa: Zarejestrowani
Postów: 1 660
Pomógł: 13
Dołączył: 9.06.2004
Skąd: Wrocław i okolice

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

Proste smile.gif Tylko zastanawiams się w czym jest prostsze od advAJAX ? smile.gif

[HTML] pobierz, plaintext 
  1. advAJAX.post({
  2.             url : "url.php",
  3.             parameters:{
  4.       numer: numer
  5.             },
  6.             onSuccess : function(obj) { alert(obj.responseText);}
  7. });
[HTML] pobierz, plaintext

Może troszkę prostrze to jest, ale jakoś nie mogę doczytać czy ma np. walidację parametrów?

Ale dzięki Fipaj za linka guitar.gif , warto się z tym zapoznać smile.gif

Ten post edytował TomASS 15.04.2006, 07:57:27


--------------------
www.fajrant.pl/
Go to the top of the page
+Quote Post
Fipaj
post 15.04.2006, 07:32:25
Post #4





Grupa: Zarejestrowani
Postów: 691
Pomógł: 0
Dołączył: 19.01.2005
Skąd: Warszawa

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

Nieeeeee! Czwarty raz ktoś przekręca mojego nicka, w tym po raz drugi ty, TmSAS biggrin.gif (OK, OK - TomASS ;])

prostsze ;-)

Walidacji parametrów nie ma... ale to jest naprawdę lightweight library, ~1.3kb ;-)

Ten post edytował Fipaj 15.04.2006, 08:03:30


--------------------
Mój skromy blog ;-)
Go to the top of the page
+Quote Post
TomASS
post 15.04.2006, 08:02:39
Post #5





Grupa: Zarejestrowani
Postów: 1 660
Pomógł: 13
Dołączył: 9.06.2004
Skąd: Wrocław i okolice

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

Cytat
Nieeeeee! Czwarty raz ktoś przekręca mojego nicka, w tym po raz drugi ty, TmSAS

Przepraszam bardzo, to się więcej nie powtórzy smile.gif
Już to poprawiłem

Wracając do dyskusji:
Cytat
Walidacji parametrów nie ma

No właśnie sad.gif

Cytat
ale to jest naprawdę lightweight library, ~1.3kb ;-)

Zgadza się smile.gif To jest jej duży plus, lecz dodaj do tego 3.2 kb prototype.lite. co i tak daje małą bibliotekę smile.gif


--------------------
www.fajrant.pl/
Go to the top of the page
+Quote Post
Fipaj
post 15.04.2006, 08:06:19
Post #6





Grupa: Zarejestrowani
Postów: 691
Pomógł: 0
Dołączył: 19.01.2005
Skąd: Warszawa

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

Ktoś zasugerował, aby wszystkie produktu mad4milk (moo.fx, moo.ajax, moo.dom) przepisać na troszkę większe, ale bez użycia prototype. Autor nie był zainteresowany...

Obecnie zainteresowałem się moo.fx.pack, lecę testować ;-)


--------------------
Mój skromy blog ;-)
Go to the top of the page
+Quote Post
seaquest
post 16.04.2006, 20:52:23
Post #7





Grupa: Przyjaciele php.pl
Postów: 790
Pomógł: 7
Dołączył: 6.02.2003
Skąd: Polska

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

Tylko jak ktoś kiedyś mądry powiedział: Po co wyważać otwarte drzwi?. Skoro Prototype ma AJAX'a, to czemu z niego nie korzystać. Jest tak samo prosty (a nawet chyba prostszy) od tego przedstawionego... A możliwości ma dużo większe (np. Ajax.Updater)


--------------------
Michał Płachta
Warsztat: Mac OS X Leopard, PostgreSQL, Text Mate, Retrospectiva + SVN
Go to the top of the page
+Quote Post
splatch
post 18.04.2006, 23:28:57
Post #8





Grupa: Zarejestrowani
Postów: 487
Pomógł: 7
Dołączył: 7.01.2004
Skąd: Warszawa

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

// popieram seaquesta.


--------------------
Łukasz Dywicki
Independent Java and open source software consultant.
Blog - Java, OSGi, integracja oprogramowania..
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 Wersja Lo-Fi Aktualny czas: 27.04.2024 - 14:35
Powered By IP.Board © 2024  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn