Requêtes automatique : le code source

Javascript

function initXHR() {
    var xhr = null;
  if (window.XMLHttpRequest) { 
    xhr = new XMLHttpRequest();
  } 
  else {
      alert("Votre navigateur ne supporte pas les objets XMLHttpRequest.");
  }
  return xhr;
}

function getListeAuteurs() {
  var xhr = initXHR();
  var div = document.getElementById('resultat');
  var texteSaisie = document.getElementById('aut_nom').value;
  var url = "auteurs.php?aut_nom="+texteSaisie;
  xhr.open("GET",url);
  xhr.onreadystatechange = function() {
    if (xhr.readyState==4) {
      if (xhr.status == 200) {
	div.innerHTML = xhr.responseText;
      }
      else {
	div.innerHTML = "Erreur serveur : "+xhr.status+" "+xhr.statusText;
	xhr.abort();
      }
      div.style.display = "block";
    }
  }
  xhr.send();
}

HTML

<form action="auteurs.php" method="GET" name="form">
<input id="aut_nom" name="aut_nom" 
       type="text" size="20" 
       onkeyup="getListeAuteurs();" value=""  />
<input type="submit" value="envoie" />
</form>
contenu

PHP

<?php
header("Content-Type: text/plain");

  try {
    $dbh = new PDO('...');

    if (isset($_GET['aut_nom'])) {
      $aut_nom = &$_GET['aut_nom'];
    }

    $requete = 'SELECT * from auteur WHERE aut_nom LIKE :aut_nom'; 
    echo 'SELECT * from auteur WHERE aut_nom LIKE '.$aut_nom.'%';
    
    $dbs1 = $dbh->prepare($requete);
    $dbs1->bindValue(':aut_nom', $aut_nom.'%', PDO::PARAM_STR);
    $dbs1->execute();
 
    $tab = $dbs1->fetchAll($fetch_style = PDO::FETCH_ASSOC );

    $resultat =  "<table border='1'>\n";

    $ligne0 = $tab[0];
    $resultat .= "<tr>\n";
    foreach ($ligne0 as $col => $val) {
      $resultat .= "<th>".$col."</th>";
    }
    $resultat .= "</tr>\n";


    foreach ($tab as $ligne) {
      $resultat .= "<tr>\n";
      foreach ($ligne as $col) {
      $resultat .= "<td>".$col."</td>";
	
      }
      $resultat .= "</tr>\n";
    }
    $resultat .= "</table>\n";

    echo $resultat;

  } catch (PDOException $e) {
    print "<br />Erreur !: " . $e->getMessage() . "<br/>";
    die();
    }
?>