Salut,
j'ai relu un peu l'ensemble de ton post, tu n'a pas saisi complètement le principe de Ajax, car à un moment tu dis que la page se recharge lors de l'appel de Ajax.
Si j'ai bien compris tu as
une page index.php dans laquelle on saisi des valeurs, cette page appelle la page nouvelle-personne.php afin de faire confirmer les données saisies par l'utilisateur et c'est la que tu veux par Ajax enregistrer les valeurs.
Alors la requette Ajax ne doit pas appeler le script nouvelle-personne.php sinon c'est normal que ça la recharge.
Ajax doit appeler un autre script qui fera ce boulot d'enregistrement et rendra la réponse.
En résumé:
index.php ----->nouvelle-personne.php
dans nouvelle personne.php (à la validation: fonction Ajax va appeler le script enregistrement.php)
le script enregistrement.php va faire INSERT INTO... et donnera le résultat qui par le innerHTML serra écrit dans la page nouvelle-personne.php
donc tes scripts deviennent:
nouvelle-personne.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Nouvelle personne dans le carnet d'adresse</title>
<link rel="stylesheet" type="text/css" href="carnet-dadresse.css" />
<script language="javascript" type="text/javascript">
function submitForm(url,id_ecrire,valide, prenom, nom, lieu, tel_fixe, tel_portable, adresse, email, date){
var xhr;
try {
xhr = new ActiveXObject('Msxml2.XMLHTTP');
}
catch (e){
try { xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
catch (e2){
try {
xhr = new XMLHttpRequest();
}
catch (e3) {
xhr = false;
}
}
}
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
document.getElementById(id_ecrire).innerHTML="ok! <a href='index.php'>back</a>";
}else{
document.getElementById(id_ecrire).innerHTML="Error code " + xhr.status;
}
}
}
xhr.open("POST", url, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
var data = "valide="+valide+"&prenom="+prenom+"&nom="+nom+"&lieu="+lieu+"&tel_fixe="+tel_fixe+"&tel_portable="+tel_portable+"&adresse="+adresse+"&email="+email+"&date="+date;
xhr.send(data);
}
</script>
</head>
<body>
<h1>Nouvelle personne dans le carnet d'adresse</h1>
<?php
if(isset($_POST['prenom']) && isset($_POST['nom']) && isset($_POST['lieu'])){
if($_POST['prenom']!=NULL && $_POST['nom']!=NULL && $_POST['lieu']!=NULL){
$prenom=$_POST['prenom'];
$nom=$_POST['nom'];
$lieu=$_POST['lieu'];
if(isset($_POST['tel_fixe']) && $_POST['tel_fixe'] != NULL){
$tel_fixe=$_POST['tel_fixe'];
}else{
$tel_fixe="";
}
if(isset($_POST['tel_portable']) && $_POST['tel_portable'] != NULL){
$tel_portable=$_POST['tel_portable'];
}else{
$tel_portable="";
}
if(isset($_POST['adresse']) && $_POST['adresse'] != NULL){
$adresse=$_POST['adresse'];
}else{
$adresse="";
}
if(isset($_POST['email']) && $_POST['email'] != NULL){
$email=$_POST['email'];
}else{
$email="";
}
$date=date("Y-m-d H:i:s");
echo "<div id='conteneur'>";
echo "Prénom : ".$prenom."<br />";
echo "Nom : ".$nom."<br />";
echo "Lieu de connaissance : ".$lieu."<br />";
echo "Téléphone fixe : ".$tel_fixe."<br />";
echo "Téléphone portable : ".$tel_portable."<br />";
echo "Adresse : ".$adresse."<br />";
echo "Email : ".$email."<br />";
echo "Les données sont correctes et je valide le nouveau membre du répertoire : ";
?>
<form name="ma_form" method="post">
<?php
echo "<input type='hidden' name='prenom' value='$prenom' />";
echo "<input type='hidden' name='nom' value='$nom' />";
echo "<input type='hidden' name='lieu' value='$lieu' />";
echo "<input type='hidden' name='tel_fixe' value='$tel_fixe' />";
echo "<input type='hidden' name='tel_portable' value='$tel_portable' />";
echo "<input type='hidden' name='adresse' value='$adresse' />";
echo "<input type='hidden' name='email' value='$email' />";
echo "<input type='hidden' name='date' value='$date' />";
?>
<!-- attention, j'ai modifié la fonction, on passe en plus le nom du script appelé et l'id du div a ecrire en arguments à la fonction -->
<input type="button" value="Valider" onClick="submitForm('enregistrement.php','info',<?php echo "ok,".$prenom.",".$nom.",".$lieu.",".$tel_fixe.",".$tel_portable.",".$adresse.",".$email.",".$date; ?>);" />
<?php
echo "</form>";
echo "</div>";
}
}
?>
<div id="info"></div>
</body>
</html>
et
enregistrement.php:
<?php
//script enregistrement.php appelé par la fonction Ajax
if (isset($_POST['valide']) && $_POST['valide']=="ok"){
$prenom=$_POST['prenom'];
$nom=$_POST['nom'];
$lieu=$_POST['lieu'];
$tel_fixe=$_POST['tel_fixe'];
$tel_portable=$_POST['tel_portable'];
$adresse=$_POST['adresse'];
$email=$_POST['email'];
$date=$_POST['date'];
mysql_connect("localhost", "root", "");
mysql_select_db("carnet_adresse");
$query="INSERT INTO carnet VALUES ('', '".$prenom."','".$nom."','".$lieu."','".$tel_fixe."','".$tel_portable."','".$adresse."','".$email."','".$date.")";
$requette=mysql_query($query);
//en fonction du resultat de la requette à la base on envoie la réponse à la fonction Ajax
if($requette){
echo "Enregistrement réussi !";
}else{
echo "L'enregistrement a échoué !";
}
mysql_close();
}
//attention si il clique plusieures fois sur le bouton tu vas avoir autant d'enregistrements, donc dans ce script il faut peut être vérifier que tu n'a pas déja cette personne avnat d'enregistrer ??
?>
PS: je suis à nouveau absent à partir de demain matin.
Alert javascript avec du php
