06. AJAX PHP

AJAX Παράδειγμα PHP


Το AJAX χρησιμοποιείται για τη δημιουργία περισσότερων διαδραστικών εφαρμογών.


AJAX Παράδειγμα PHP

Το παρακάτω παράδειγμα δείχνει τον τρόπο με τον οποίο μια ιστοσελίδα μπορεί να επικοινωνήσει με ένα διακομιστή ιστού ενώ ο χρήστης πληκτρολογεί χαρακτήρες σε ένα πεδίο εισαγωγής:

Παράδειγμα

Start typing a name in the input field below:

Suggestions:

First name:


Επεξήγηση παραδείγματος

Στο παραπάνω παράδειγμα, όταν ένας χρήστης πληκτρολογεί έναν χαρακτήρα στο πεδίο εισαγωγής, showHint()εκτελείται μια συνάρτηση που ονομάζεται .

Η συνάρτηση ενεργοποιείται από το γεγονός onkeyup.

Εδώ είναι ο κώδικας HTML:

Παράδειγμα

<html>
<head>
<script>
function showHint(str) {
  if (str.length == 0) {
    document.getElementById("txtHint").innerHTML = "";
    return;
  } else {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById("txtHint").innerHTML = this.responseText;
      }
    };
    xmlhttp.open("GET", "gethint.php?q=" + str, true);
    xmlhttp.send();
  }
}
</script>
</head>
<body>

<p><b>Start typing a name in the input field below:</b></p>
<form>
First name: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>

Δοκιμάστε το »

Εξήγηση κώδικα:

Πρώτα, ελέγξτε αν το πεδίο εισαγωγής είναι άδειο (str.length == 0). Εάν είναι, καθαρίστε το περιεχόμενο του σύμβολο κράτησης θέσης και τερματίστε τη συνάρτηση.

Ωστόσο, εάν το πεδίο εισαγωγής δεν είναι άδειο, κάντε τα εξής:

  • Δημιουργήστε ένα αντικείμενο XMLHttpRequest
  • Δημιουργήστε τη συνάρτηση που θα εκτελεστεί όταν είναι έτοιμη η απάντηση του διακομιστή
  • Στείλτε την αίτηση σε ένα αρχείο PHP (gethint.php) στο διακομιστή
  • Παρατηρήστε ότι η παράμετρος q προστέθηκε gethint.php? Q = “+ str
  • Η μεταβλητή str διατηρεί το περιεχόμενο του πεδίου εισαγωγής

Το αρχείο PHP – “gethint.php”

Το αρχείο PHP ελέγχει μια σειρά από ονόματα και επιστρέφει το αντίστοιχο όνομα στο πρόγραμμα περιήγησης:

<?php
// Array with names
$a[] = "Anna";
$a[] = "Brittany";
$a[] = "Cinderella";
$a[] = "Diana";
$a[] = "Eva";
$a[] = "Fiona";
$a[] = "Gunda";
$a[] = "Hege";
$a[] = "Inga";
$a[] = "Johanna";
$a[] = "Kitty";
$a[] = "Linda";
$a[] = "Nina";
$a[] = "Ophelia";
$a[] = "Petunia";
$a[] = "Amanda";
$a[] = "Raquel";
$a[] = "Cindy";
$a[] = "Doris";
$a[] = "Eve";
$a[] = "Evita";
$a[] = "Sunniva";
$a[] = "Tove";
$a[] = "Unni";
$a[] = "Violet";
$a[] = "Liza";
$a[] = "Elizabeth";
$a[] = "Ellen";
$a[] = "Wenche";
$a[] = "Vicky";

// get the q parameter from URL
$q = $_REQUEST["q"];

$hint = "";

// lookup all hints from array if $q is different from ""
if ($q !== "") {
  $q = strtolower($q);
  $len=strlen($q);
  foreach($a as $name) {
    if (stristr($q, substr($name, 0, $len))) {
      if ($hint === "") {
        $hint = $name;
      } else {
        $hint .= ", $name";
      }
    }
  }
}

// Output "no suggestion" if no hint was found or output correct values
echo $hint === "" ? "no suggestion" : $hint;
?>

Days
Hours
Minutes

06. AJAX PHP

Κοινοποίηση

Share on facebook
Share on twitter

Ακολουθήστε μας

Αρέσει σε %d bloggers: