Tutorial Ajax
Ajax - XMLHttpRequest Object
Innainte sa trimite informatii catre server trebuie mai intai sa scriem o functie care va fi capabila sa primeasca aceasta informatie. Vom trata pe rand fiecare parte a scriptului care trebuie trebuie inclusa in documentul nostru.
Vom incepe cu onreadystatechange. Aceasta proprietate a XMLHttpRequest, face posibila stocarea functiei care va procesa raspunsul serverului.
| // Crearea unei functii care va primii informatia trimisa de catre server |
O alta proprietate este readyState. Aceasta stocheaza stadiul in care se afla raspunsului serverului. Raspunsul se poate poate procesa, downlada, sau poate fi in curs de completare. Singura valoare pe care o vom aborda si care de fapt ne intereseaza cu adevarat, este accea din care rezulta ca operatiunea a fost completata.
Atunci cand readyState are valoarea 4 inseamna ca operatiunea a fost completata si vom avea acces la informatiile trimise de catre server.
| // Crearea unei functii care va primii informatia trimisa de catre server |
In momentul in care am primit raspunsul putem folosi responseText, care il va prelua. Vom numi formularul nostru "myform" si vom folosi document.FormName.InputName.value pentru a accesa formularul cu ajutorul javascript
| // Crearea unei functii care va primii informatia trimisa de catre server |
Cum Trimitem un request serverului? foarte simplu
- Stabilind adresa de URL a scriptului care va fi foloit in aplicatia noastra Ajax.
- Folosind functia de trimitere pentru a.....trimite informatia....destul de logic, zic eu.
Vom crea un document pe care il vom numi "serverTime.php". Presupunand ca fisierul nostru "order.html" este in acelasi folder cu "serverTime.php" vom avea codul:
| // Crearea unei functii care va primii informatia trimisa de catre server |
Iar acum vom adauga functia de trimitere:
| // Crearea unei functii care va primii informatia trimisa de catre server |
Incheiere
Ar fi cazul sa cam punem fragmentele de script cap la cap si sa facem ceva util cu ele. Vom face ca atunci cand un user scrie ceva in campul Name si muta cursorul in campul Time acesta sa se completeza automat cu ora serverului.
Vom volosi in acest sens atributul onChange.
| <html> <script language="javascript" type="text/javascript"> //-->
<form name='myForm'> |
Si cu toate aste am terminat cu partea mai dificila si vom continua cu scrierea documentului php si anume "serverTime.php" pe care la pomenit dar care inca nu exista.
Pentru ca scripturile sa poata colabora reciproc ar trebui sa fie in acelasi director.
| <?php |
Atat deocamdata, vom mai vorvi despre ajax intr-un tutorial urmator.
Aveti aici un exemplu functional a ceea ce am incercat sa facem.bafta.
Comentarii
Foarte util acest tutorial..! Buna treaba tineo tot asa, amice..!
Voteaza acest articol!
Trimite un comentariu!
