PHP „Ajax“ pamoka su pavyzdžiu

Kas yra „Ajax“?

Visa AJAX forma yra asinchroninis „JavaScript“ ir XML. Tai technologija, sumažinanti serverio ir kliento sąveiką. Tai daro atnaujindama tik dalį tinklalapio, o ne visą puslapį. Asinchronines sąveikas inicijuoja „JavaScript“. AJAX tikslas yra keistis nedideliais duomenų kiekiais su serveriu be puslapio atnaujinimo.

„JavaScript“ yra kliento pusės scenarijų kalba. Jį kliento pusėje vykdo žiniatinklio naršyklės, palaikančios „JavaScript“. „JavaScript“ kodas veikia tik tose naršyklėse, kuriose įgalinta „JavaScript“.

XML yra Extensible Markup Language akronimas. Jis naudojamas pranešimams užkoduoti tiek žmonėms, tiek mašinoje skaitomiems formatams. Tai panašu į HTML, bet leidžia jums sukurti savo priskirtas žymas. Norėdami gauti daugiau informacijos apie XML, žr. Straipsnį apie XML

Kodėl naudoti AJAX?

  • Tai leidžia kurti turtingas interaktyvias žiniatinklio programas, kaip ir darbalaukio programas.
  • Patvirtinimas gali būti atliekamas vartotojui užpildžius formą nepateikiant. Tai galima pasiekti naudojant automatinį užbaigimą. Žodžiai, kuriuos įveda vartotojas, pateikiami serveriui apdoroti. Serveris atsako raktiniais žodžiais, kurie atitinka vartotojo įvestus žodžius.
  • Juo galima užpildyti išskleidžiamąjį laukelį, atsižvelgiant į kito išskleidžiamojo langelio vertę
  • Duomenis galima gauti iš serverio ir atnaujinti tik tam tikrą puslapio dalį, neįkeliant viso puslapio. Tai labai naudinga tinklalapio dalims, įkeliančioms tokius dalykus kaip
    • „Tweets“
    • „Commens“
    • Vartotojai, apsilankantys svetainėje ir kt.

Kaip sukurti PHP Ajax programą

Sukursime paprastą programą, kuri leis vartotojams ieškoti populiarių PHP MVC karkasų.

Mūsų programoje bus teksto laukelis, kurį vartotojai įves pagrindo pavadinimus.

Tada mes naudosime „mvc AJAX“ ieškodami atitikties, tada rodysime visą sistemos pavadinimą po paieškos forma.

1 žingsnis) Sukurkite rodyklės puslapį

Index.php

PHP MVC Frameworks - Search Engine

PHP MVC Frameworks - Search Engine


Type the first letter of the PHP MVC Framework








Matches:

ČIA

  • „Onkeyup =" showName (this.value) "" vykdo „JavaScript“ funkciją showName kiekvieną kartą, kai į teksto laukelį įvedamas raktas.

    Ši funkcija vadinama automatiniu užbaigimu

2 žingsnis) Sukurkite rėmelių puslapį

rėmai.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;?>

3 žingsnis) Sukurkite JS scenarijų

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

ČIA

  • „If (str.length == 0)“ patikrinkite eilutės ilgį. Jei jis yra 0, likusi scenarijaus dalis nebus vykdoma.
  • „If (window.XMLHttpRequest)…“ „Internet Explorer“ 5 ir 6 versijose AJAX diegimui naudojama „ActiveXObject“. Kitos versijos ir naršyklės, pvz., „Chrome“, „Firefox“, naudoja „XMLHttpRequest“. Šis kodas užtikrins, kad mūsų programa veiktų ir IE 5, ir 6, ir kitose aukštosiose IE bei naršyklių versijose.
  • „Xmlhttp.onreadystatechange = function…“ patikrina, ar AJAX sąveika baigta ir būsena yra 200, tada atnaujina „txtName“ intervalą pateiktais rezultatais.

4 žingsnis) Mūsų PHP Ajax programos testavimas

Darant prielaidą, kad išsaugojote failą index.php, naudodami „phututs“ / „ajax“, pereikite prie URL http: //localhost/phptuts/ajax/index.php

Teksto laukelyje įveskite C raidę. Gausite šiuos rezultatus.

Aukščiau pateiktas pavyzdys parodo AJAX sampratą ir tai, kaip ji gali padėti mums kurti turtingas sąveikos programas.

Santrauka

  • AJAX yra asinchroninio „JavaScript“ ir XML santrumpa
  • AJAX yra technologija, naudojama kurti turtingas sąveikos programas, kurios sumažina kliento ir serverio sąveiką atnaujinant tik tinklalapio dalis.
  • „Internet Explorer“ 5 ir 6 versijos naudoja „ActiveXObject“ AJAX operacijoms įgyvendinti.
  • „Internet Explorer“ 7 ir naujesnė versija bei naršyklės „Chrome“, „Firefox“, „Opera“ ir „Safari“ naudoja „XMLHttpRequest“.

Įdomios straipsniai...