Vadnica za PHP Ajax s primerom

Kazalo:

Anonim

Kaj je Ajax?

Polna oblika AJAX je Asinhroni JavaScript in XML. To je tehnologija, ki zmanjšuje interakcije med strežnikom in odjemalcem. To naredi tako, da posodobi samo del spletne strani in ne celotne strani. Asinhrone interakcije sproži JavaScript. Namen AJAX je izmenjava majhnih količin podatkov s strežnikom brez osveževanja strani.

JavaScript je odjemalski skriptni jezik. Na strani odjemalca ga izvajajo spletni brskalniki, ki podpirajo JavaScript. Koda JavaScript deluje samo v brskalnikih, ki imajo omogočen JavaScript.

XML je kratica za Extensible Markup Language. Uporablja se za kodiranje sporočil v človeški in strojno berljivi obliki zapisa. Je kot HTML, vendar vam omogoča ustvarjanje oznak po meri. Za več podrobnosti o XML glejte članek o XML

Zakaj uporabljati AJAX?

  • Omogoča razvoj bogatih interaktivnih spletnih aplikacij, tako kot namiznih aplikacij.
  • Preverjanje velja, ko uporabnik izpolni obrazec, ne da bi ga oddal. To je mogoče doseči s samodejnim dokončanjem. Besede, ki jih uporabnik vnese, se pošljejo strežniku v obdelavo. Strežnik odgovori s ključnimi besedami, ki se ujemajo s tem, kar je vnesel uporabnik.
  • Z njim lahko zapolnite spustno polje, odvisno od vrednosti drugega spustnega polja
  • Podatke je mogoče pridobiti s strežnika in posodobiti le določen del strani, ne da bi se naložila celotna stran. To je zelo koristno za dele spletnih strani, ki nalagajo stvari
    • Tweets
    • Commens
    • Uporabniki, ki obiščejo spletno stran itd.

Kako ustvariti aplikacijo PHP Ajax

Ustvarili bomo preprosto aplikacijo, ki uporabnikom omogoča iskanje priljubljenih okvirov PHP MVC.

Naša aplikacija bo imela besedilno polje, ki ga bodo uporabniki vnesli v imena okvira.

Nato bomo uporabili mvc AJAX za iskanje ujemanja, nato pa tik pod iskalnim obrazcem prikazali celotno ime ogrodja.

Korak 1) Ustvarjanje indeksne strani

Index.php

PHP MVC Frameworks - Search Engine

PHP MVC Frameworks - Search Engine


Type the first letter of the PHP MVC Framework








Matches:

TUKAJ,

  • “Onkeyup =" showName (this.value) "" izvede funkcijo JavaScript showName vsakič, ko v besedilno polje vtipkate ključ.

    Ta funkcija se imenuje samodejno dokončanje

Korak 2) Ustvarjanje strani ogrodja

frameworks.php

 0) {$match = "";for ($i = 0; $i < count($frameworks); $i++) {if (strtolower($name) == strtolower(substr($frameworks[$i], 0, strlen($name)))) {if ($match == "") {$match = $frameworks[$i];} else {$match = $match . " , " . $frameworks[$i];}}}}echo ($match == "") ? 'no match found' : $match;?>

Korak 3) Ustvarjanje skripta JS

auto_complete.js

function showName(str){if (str.length == 0){ //exit function if nothing has been typed in the textboxdocument.getElementById("txtName").innerHTML; //clear previous resultsreturn;}if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest();} else {// code for IE6, IE5xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.onreadystatechange=function() {if (xmlhttp.readyState == 4 && xmlhttp.status == 200){document.getElementById("txtName").innerHTML=xmlhttp.responseText;}}xmlhttp.open("GET","frameworks.php?name="+str,true);xmlhttp.send();}

TUKAJ,

  • “If (str.length == 0)” preverite dolžino niza. Če je 0, se preostali del skripta ne izvede.
  • “If (window.XMLHttpRequest) ...” Internet Explorer različice 5 in 6 za izvajanje AJAX uporablja ActiveXObject. Druge različice in brskalniki, kot sta Chrome in FireFox, uporabljajo XMLHttpRequest. Ta koda bo zagotovila, da naša aplikacija deluje tako v IE 5 in 6 kot tudi v drugih visokih različicah IE in brskalnikih.
  • »Xmlhttp.onreadystatechange = function ...« preveri, ali je interakcija AJAX končana in je stanje 200, nato pa vrne rezultate txtName.

Korak 4) Testiranje naše aplikacije PHP Ajax

Ob predpostavki, da ste shranili datoteko index.php V phututs / ajax poiščite URL http: //localhost/phptuts/ajax/index.php

V besedilno polje vnesite črko C. Dobili boste naslednje rezultate.

Zgornji primer prikazuje koncept AJAX in kako nam lahko pomaga ustvariti bogate interakcijske aplikacije.

Povzetek

  • AJAX je kratica za Asinhroni JavaScript in XML
  • AJAX je tehnologija, ki se uporablja za ustvarjanje bogatih aplikacij za interakcijo, ki zmanjšujejo interakcije med odjemalcem in strežnikom s posodobitvijo samo delov spletne strani.
  • Internet Explorer različice 5 in 6 uporablja ActiveXObject za izvajanje operacij AJAX.
  • Internet Explorer različice 7 in novejše in brskalniki Chrome, Firefox, Opera in Safari uporabljajo XMLHttpRequest.