Apa itu Ajax?
Borang penuh AJAX adalah Asynchronous JavaScript & XML. Ini adalah teknologi yang mengurangkan interaksi antara pelayan dan pelanggan. Ia melakukannya dengan mengemas kini hanya sebahagian daripada laman web dan bukan keseluruhan halaman. Interaksi tak segerak dimulakan oleh JavaScript. Tujuan AJAX adalah untuk menukar sejumlah kecil data dengan pelayan tanpa penyegaran halaman.
JavaScript adalah bahasa skrip sisi pelanggan. Ini dilaksanakan di sisi klien oleh penyemak imbas web yang mendukung JavaScript. Kod JavaScript hanya berfungsi pada penyemak imbas yang mengaktifkan JavaScript.
XML adalah singkatan dari Extensible Markup Language. Ia digunakan untuk menyandikan mesej dalam format yang dapat dibaca manusia dan mesin. Ini seperti HTML tetapi membolehkan anda membuat tag tersuai. Untuk keterangan lebih lanjut mengenai XML, lihat artikel tentang XML
Mengapa menggunakan AJAX?
- Ia membolehkan pengembangan aplikasi web interaktif yang kaya seperti aplikasi desktop.
- Pengesahan dapat dilakukan ketika pengguna mengisi borang tanpa mengemukakannya. Ini dapat dicapai dengan penyelesaian automatik. Kata-kata yang pengguna taipkan dihantar ke pelayan untuk diproses. Pelayan bertindak balas dengan kata kunci yang sepadan dengan apa yang dimasukkan oleh pengguna.
- Ini dapat digunakan untuk mengisi kotak dropdown bergantung pada nilai kotak dropdown yang lain
- Data dapat diambil dari pelayan dan hanya bahagian tertentu dari halaman yang dikemas kini tanpa memuat keseluruhan halaman. Ini sangat berguna untuk bahagian halaman web yang memuatkan perkara seperti
- Tweet
- Sepatutnya
- Pengguna yang melayari laman web dll.
Cara Membuat aplikasi PHP Ajax
Kami akan membuat aplikasi mudah yang membolehkan pengguna mencari kerangka kerja PHP MVC yang popular.
Aplikasi kami akan mempunyai kotak teks yang pengguna akan taipkan nama kerangka.
Kami kemudian akan menggunakan mvc AJAX untuk mencari perlawanan dan memaparkan nama lengkap rangka tepat di bawah borang carian.
Langkah 1) Membuat halaman indeks
Indeks.php
PHP MVC Frameworks - Search Engine PHP MVC Frameworks - Search Engine
Type the first letter of the PHP MVC Framework
Matches:
DI SINI,
-
"Onkeyup =" showName (this.value) "" melaksanakan fungsi JavaScript showName setiap kali kunci ditaip di kotak teks.
Ciri ini dipanggil auto lengkap
Langkah 2) Membuat halaman kerangka kerja
kerangka kerja.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;?>
Langkah 3) Membuat skrip 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();}
DI SINI,
- "If (str.length == 0)" periksa panjang tali. Sekiranya 0, maka skrip yang selebihnya tidak dijalankan.
- "If (window.XMLHttpRequest) ..." Internet Explorer versi 5 dan 6 menggunakan ActiveXObject untuk pelaksanaan AJAX. Versi dan penyemak imbas lain seperti Chrome, FireFox menggunakan XMLHttpRequest. Kod ini akan memastikan bahawa aplikasi kita berfungsi di IE 5 & 6 dan versi tinggi IE dan penyemak imbas lain.
- "Xmlhttp.onreadystatechange = function ..." memeriksa apakah interaksi AJAX selesai dan statusnya 200 kemudian mengemas kini rentang txtName dengan hasil yang dikembalikan.
Langkah 4) Menguji aplikasi PHP Ajax kami
Dengan andaian anda telah menyimpan file index.php Dalam phututs / ajax, layari URL http: //localhost/phptuts/ajax/index.php
Ketik huruf C di kotak teks Anda akan mendapat hasil berikut.
Contoh di atas menunjukkan konsep AJAX dan bagaimana ia dapat membantu kita membuat aplikasi interaksi yang kaya.
Ringkasan
- AJAX adalah akronim untuk Asynchronous JavaScript dan XML
- AJAX adalah teknologi yang digunakan untuk membuat aplikasi interaksi yang kaya yang mengurangkan interaksi antara klien dan pelayan dengan hanya mengemas kini bahagian laman web.
- Internet Explorer versi 5 dan 6 menggunakan ActiveXObject untuk melaksanakan operasi AJAX.
- Penjelajah Internet versi 7 ke atas dan penyemak imbas Chrome, Firefox, Opera, dan Safari menggunakan XMLHttpRequest.