Après beaucoup de recherche j'ai fini par résoudre mon problème et je le poste pour ceux à qui ça pourrait être utile.
On a besoin de trois fichiers celui du formulaire que je peux appeler formulaire.html ,celui qui reçoit la raquette appelé traitement_reponse.php et enfin un fichier javascript où l'on va mettre l'objet XMLHttpRequest d'ajax
Dans le fichier formulaire.html on a notre furmulaire:
Code HTML :
<html>
<head>
<title="exemple d'utilisation d'ajax</title>
<script type="text/javascript" src="objetXHR.js"></script>
<script type="text/javascript">
function request(variable)
{
var xhr = getXMLHttpRequest();//je crèe l'objet XMLHttpRequest
//je définie les variables
var Statut = document.getElementById('statut').options[document.getElementById('statut').selectedIndex].value;
var Nom = document.getElementById('nom').value;
var Prenom = document.getElementById('prenom').value;
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))//si la reponse du serveur est prête:
{
var resultat;
resultat = xhr.responseText;
variable.textContent = resultat; //variable passée en argument
//on peut faire un alert avec le résultat
alert(resultat);
}
if(xhr.readyState < 4) // si le serveur n'a pas encore répondu
{
// on peut afficher un image de pregression
}
};
//on protège les variables pour conserver les caractère spéciaux et les espaces
var nom_e = encodeURIComponent(nom);
var prenom_e = encodeURIComponent(prenom);
//les variables que l'on va envoyer en methode post
var date = "Nom="+Nom+"&Prenom="+Prenom+"&Statut="+Statut;
//on envoie enfin la requêtte
xhr.open("POST", "traitement_reponse.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
}
</script>
</head>
<form name="mon_formulaire" method="post" aciont="page_suivante.php">
<label for="nom"> votre nom:</label>
<input type="text" name="nom" id="nom" value="votre nom" /> <br /><br />
<labe for="prenom">Votre prenom:</label>
<input type="text" name="prenom" id="prenom" value="votre prénom" /><br /><br />
<label for="statut">Votre statut:</label>
<select name="statut" id="statut" onchange="request"(document.getElementById('nbPoint');>
<option value="sélectionner" selected="selected">Sélectionner</option>
<option value="nouveau">Nouveau</option>
<option value="ancien">Ancien</option>
</select>
</form>
<br />
<div id="nbPoint">
Vos points
</div>
</html>
Le fichier javascript qui contient notre objet XMLHttprequest:
Code Javascript :
function getXMLHttpRequest()
{
var xhr = null;
if (window.XMLHttpRequest || window.ActiveXObject)
{
if (window.ActiveXObject)
{
try
{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
xhr = new XMLHttpRequest();
}
}
else
{
alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
return null;
}
return xhr;
}
Le fichier php qui va traiter la requête :traitement_reponse.php
Code PHP :
header("Content-Type: text/plain");
require_once("config.php"); //le ficher de configuration
//la connection à la bd
$connect=mysql_connect($host,$user_ap,$pass_user);
mysql_select_db($db);
if(!empty($_POST["Statut"]) && !empty($_POST['Nom']) && !empty($_POST['Prenom']))
{
$Nom = mysql_real_escape_string($_POST['Nom']);
$Prenom = mysql_real_escape_string($_POST['Prenom']);
$req = mysql_query("SELECT Nbr_point FROM TABLE WHERE Nom = '$Nom' AND Prenom ='$Prenom'") or die(mysql_error());
$result = mysql_fetch_array($req);
$NBPoint = $result['Nbr_point'];
//la réponse qu'envoie le serveur
echo $NBPoint;
}
Bon voila j'espère que ce code va aider beaucoup de personnes. c'est vrai qu'il est incomplet concernant l'épuration des variables afin de voir si elle ne contient pas des impuretés avant d'être envoyer par la requête mais c'est juste fait à la va vite, pour éclairer ceux qui en ont besoin. surtout n'oubliez pas de coucher la case si ça vous aider. merci