PHP Ajaxi õpetus koos näitega

Lang L: none (table-of-contents):

Anonim

Mis on Ajax?

AJAX-i täisvorm on asünkroonne JavaScripti ja XML-i. See on tehnoloogia, mis vähendab serveri ja kliendi interaktsioone. Seda tehakse värskendades ainult osa veebilehest, mitte kogu lehte. Asünkroonsed suhted algatab JavaScripti. AJAX-i eesmärk on väikeste andmemahtude vahetamine serveriga ilma lehe värskendamiseta.

JavaScript on kliendipoolne skriptikeel. Selle täidavad kliendi poolel JavaScripti toetavad veebibrauserid. JavaScripti kood töötab ainult brauserites, kus on JavaScripti lubatud.

XML on laiendatava märgistuskeele lühend. Seda kasutatakse sõnumite kodeerimiseks nii inim- kui ka masinloetavas vormingus. See on nagu HTML, kuid võimaldab teil luua kohandatud silte. XML-i kohta lisateavet leiate artiklist XML-i kohta

Miks kasutada AJAX-i?

  • See võimaldab arendada rikkalikke interaktiivseid veebirakendusi nagu töölauarakendusi.
  • Valideerimise saab teha siis, kui kasutaja täidab vormi seda esitamata. Seda saab saavutada automaatse lõpetamise abil. Sõnad, mille kasutaja sisestab, edastatakse serverile töötlemiseks. Server vastab märksõnadega, mis vastavad kasutaja sisestatud andmetele.
  • Seda saab kasutada rippmenüü täitmiseks sõltuvalt teise rippmenüü kastist
  • Andmeid saab serverist hankida ja kogu lehte laadimata värskendada ainult teatud osa lehest. See on väga kasulik veebilehtede osade jaoks, mis laadivad näiteks asju
    • Säutsud
    • Commens
    • Saiti külastavad kasutajad jne

Kuidas luua PHP Ajaxi rakendust

Loome lihtsa rakenduse, mis võimaldab kasutajatel otsida populaarseid PHP MVC raamistikke.

Meie rakendusel on tekstikast, mille kasutajad sisestavad raamistiku nimed.

Seejärel kasutame vaste otsimiseks mvc AJAX-i, seejärel kuvame raamistiku täieliku nime otsingu vormi all.

1. samm. Indeksilehe loomine

Index.php

PHP MVC Frameworks - Search Engine

PHP MVC Frameworks - Search Engine

Type the first letter of the PHP MVC Framework

Matches:

SIIN,

  • “Onkeyup =" showName (this.value) "" käivitab JavaScripti funktsiooni showName iga kord, kui tekstikasti sisestatakse võti.

    Seda funktsiooni nimetatakse automaatseks täielikuks

Samm 2) Raamistiku lehe loomine

raamistikud.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;?>

Samm 3) JS-i skripti loomine

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();}

SIIN,

  • “If (str.length == 0)” kontrollib stringi pikkust. Kui see on 0, siis ülejäänud skripti ei käivitata.
  • “If (window.XMLHttpRequest)…” Internet Exploreri versioonid 5 ja 6 kasutavad ActiveXObjecti AJAX-i juurutamiseks. Muud versioonid ja brauserid, näiteks Chrome, FireFox, kasutavad XMLHttpRequest. See kood tagab, et meie rakendus töötab nii IE 5 ja 6 kui ka muudes IE ja brauserite kõrgversioonides.
  • “Xmlhttp.onreadystatechange = function…” kontrollib, kas AJAX-interaktsioon on lõpule viidud ja olek on 200, värskendab seejärel txtName'i vahemikku tagastatud tulemustega.

4. samm. Meie PHP Ajaxi rakenduse testimine

Eeldades, et olete faili index.php salvestanud, sirvige jaotistes phututs / ajax URL-i http: //localhost/phptuts/ajax/index.php

Sisestage tekstikasti C-täht. Saate järgmised tulemused.

Ülaltoodud näide näitab AJAX-i kontseptsiooni ja seda, kuidas see aitab meil luua rikkalikke suhtlusrakendusi.

Kokkuvõte

  • AJAX on asünkroonse JavaScripti ja XML-i lühend
  • AJAX on tehnoloogia, mida kasutatakse rikkalike interaktsioonirakenduste loomiseks, mis vähendavad kliendi ja serveri vahelist suhtlust, värskendades ainult veebilehe osi.
  • Internet Exploreri versioonid 5 ja 6 kasutavad AJAX-i toimingute rakendamiseks ActiveXObjecti.
  • Internet Exploreri versioon 7 ja uuemad ning brauserid Chrome, Firefox, Opera ja Safari kasutavad XMLHttpRequest.