Requete PHP à exécuter dans du javascript

Fermé
vct - 27 juil. 2008 à 11:11
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 6 sept. 2008 à 16:24
Bonjour,

je m'y perd parmi tous les topic dans ce forum alors j'ai créé mon propre topic.

Je m'initie à l'ajax et j'aimerais ajouter des données que j'ai en php sans recharger l'ensemble de la page.
Je n'arrive pas à inclure du php dans le javascript
J'ai essayé ceci où "ajoute()" est une fonction php mais ça ne marche pas..

document.getElementById("conteneur").innerHTML = "Requête exécutée avec succès.<input type='button' value='Terminer' onclick='location.href=\"index.php\"' />";
document.getElementById("conteneur").innerHTML = ajouter();

Avez-vous une idée ?
Merci
A voir également:

29 réponses

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
27 juil. 2008 à 15:06
Salut,

Php s'exécute côté serveur, javascript côté client (navigateur)




document.getElementById("conteneur").innerHTML = "Requête exécutée avec succès.<input type='button' value='Terminer' onclick='location.href=\"index.php\"' />";

ça c'est bon

mais tu ne peux pas rajouter du php dans une page déja chargée dans ton navigateur par
document.getElementById("conteneur").innerHTML = ajouter();
puisque la page est chargée, le php rajouté ne sera pas interprété


Le principe de Ajax

dans ta page HTML, par une action par exemple un click sur un bouton, tu lances la fonction Javascript/Ajax

cette dernière appelle un script php sur le serveur, et à la réponse la fonction Ajax écrit le résultat dans la page.


Un exemple de script Javascript/Ajax:
<html>
<head>
<script language="javascript" type="text/javascript">
function makeRequest(url,id_ecrire){
	var http_request = false;
		//créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Abandon :( Impossible de créer une instance XMLHTTP');
            return false;
        }
        http_request.onreadystatechange = function() { traitementReponse(http_request,id_ecrire); } //affectation fonction appelée qd on recevra la reponse
		// lancement de la requete
		http_request.open('POST', url, true);
		//changer le type MIME de la requête pour envoyer des données avec la méthode POST ,  !!!! cette ligne doit etre absolument apres http_request.open('POST'....
		http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		
		data="";
        http_request.send(data);
}

function traitementReponse(http_request,id_ecrire) {
	var affich="";
	if (http_request.readyState == 4) {
		if (http_request.status == 200) {
					// cas avec reponse de PHP en mode texte:
			//chargement des elements reçus dans la liste
			var affich_rep=http_request.responseText;
			//alert(affich_rep);
				obj = document.getElementById(id_ecrire); 
                obj.innerHTML = affich_rep;
		} 
		else {
                alert('Un problème est survenu avec la requête.');
        }
    }
}
</script>
</head>
<form name="ma_form" method="post">
<!-- bouton qui appelle la fonction Ajax en lui passant le nom du script php et le div ou charger la réponse -->
<input type="button" name="ajouter" value="ajouter" onClick="makeRequest('ajouter.php','conteneur');">
</form>
<br />
<div id="conteneur"><!-- la sera ecrite la reponse Ajax, ce div tu le mets ou tu veux dans ta page--></div>
</html>


et le script ajouter.php:
<?php
//la tu peux mettre les données que tu veux
echo "Requête exécutée avec succès.<input type='button' value='Terminer' onclick='location.href=\"index.php\"' />";
?> 



notes que par data= tu peux envoyer une valeur au script php

@lain
1
Salut Alain merci pour ta réponse et désolé pour le retard (vacances).
Ton code fonctionne nickel je l'ais adapté à ma page mais je voudrais savoir s'il s'agit d'ajax à proprement dit, car finalement je rafraichit quand même toute la page ?! J'ai pas essayé d'intégrer du design pour voir s'il saute ou pas.

Voici mon code :


<html>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<head>
<script language="javascript" type="text/javascript">
function makeRequest(url,id_ecrire){
var http_request = false;
//créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}

if (!http_request) {
alert('Abandon :( Impossible de créer une instance XMLHTTP');
return false;
}
http_request.onreadystatechange = function() { traitementReponse(http_request,id_ecrire); } //affectation fonction appelée qd on recevra la reponse
// lancement de la requete
http_request.open('POST', url, true);
//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

data="";
http_request.send(data);
}

function traitementReponse(http_request,id_ecrire) {
var affich="";
if (http_request.readyState == 4) {
if (http_request.status == 200) {
// cas avec reponse de PHP en mode texte:
//chargement des elements reçus dans la liste
var mon_affichage = "Success";
obj = document.getElementById(id_ecrire);
obj.innerHTML = mon_affichage;
}
else {
alert('Un problème est survenu avec la requête.');
}
}
}
</script>
</head>
<form name="ma_form" method="post">
<!-- bouton qui appelle la fonction Ajax en lui passant le nom du script php et le div ou charger la réponse -->
<input type="button" name="ajouter" value="ajouter" onClick="makeRequest('ajax.php?valide=ok','conteneur');">
</form>
<br />
<div id="conteneur"></div>
</html>
<?php
if (isset($_GET['valide']) && $_GET['valide']=="ok"){
mysql_connect("localhost", "root", "");
mysql_select_db("carnet_adresse");
mysql_query("INSERT INTO carnet VALUES ('', 'prenom', 'nom', 'lieu', '0389535603', '0389535603', 'adresse', 'email', '2008-07-07')");
}
?>
0
En fait j'ai étudié le code et je vais vous expliquer ce que je souhaite faire parce que finalement il ne me passe pas les variables POST.

j'ai un formulaire d'inscription (ajouter-personne.php)
après validation on tombe sur une nouvelle page avec un récapitulatif des infos (nouvelle-personne.php)
avec un formulaire et des champs cachés de type hidden de garde en mémoire les paramètres pour la validation
mon bouton (submit) pour valider le récapitulatif envois vers lui même (nouvelle-personne.php) mais dans le code je vérifie si il existe une variable 'valide' qui est égale à 'ok' pour faire ma requête SQL

En revanche votre code ajax ne me permet pas de passer ces variables post que je stock en variable php.

Une idée pour compléter l'ajax ?

merci, vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
3 août 2008 à 10:54
Salut,

Ajax n'envoie pas toutes les varaibles du formulaire, mais seulement les valeurs que tu viens lire par la fonction Ajax

Alors si tu veux lui en envoyer d'autres il faut completer la ligne data=..
0
petinouv Messages postés 662 Date d'inscription jeudi 1 mars 2007 Statut Membre Dernière intervention 20 mai 2009 82
3 août 2008 à 10:32
AJAX ne gère pas le POST, mais il gère le GET (enfin, on peux passer des paramètres dans l'url de la requête qui peuvent être interprétés par le script PHP)
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
3 août 2008 à 10:51
Salut petitnouv,


AJAX ne gère pas le POST, mais il gère le GET

si il gère aussi le POST ! mais pas le POST dans le sens ou on l'entend généralement c a dire par le formulaire, mais en "arrière plan"

Le script tel que j'ai donné passe les variables en POST même si la ligne data=.... ressemble à un passage via l'URL
0
petinouv Messages postés 662 Date d'inscription jeudi 1 mars 2007 Statut Membre Dernière intervention 20 mai 2009 82 > Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017
3 août 2008 à 10:57
Intéressant ! Je ne savais pas ! Voila quelque chose qui peut-être intéressant à approfondir !

;)
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894 > petinouv Messages postés 662 Date d'inscription jeudi 1 mars 2007 Statut Membre Dernière intervention 20 mai 2009
3 août 2008 à 11:01
Oui, perso je prefere envoyer en POST même pour les formulaires, alors après ça devient une habitude.

Pour que Ajax envoie en POST, il y a une ligne à mettre dans la fonction et a un endroit bien précis, il doit y avoir un commentaire dans mon script autant que je me souvienne.

@lain
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Hello, merci à vous deux pour vos réponses.
Oui effectivement y a une ligne data qui est nulle mais comme j'ai 6 paramètres à envoyer comment je sépare les données ?
Est ce que ça se présente sous cette forme par exemple :

data = prenom=moi&nom=lui&age=25

finalement l'ajax ça parait compliqué mais je trouve que ça va, c'est pas mal de par coeur..

Bonne journée
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
3 août 2008 à 21:41
Oui c'est ça:

data =" prenom=moi&nom=lui&age=25";


et dans ton script php tu récupéres par

$prenom=$_POST['prenom'];
$nom=$$_POST['nom'];

etc...

et les valeurs moi lui etc..
tu n'est pas obligé de les mettre en "dur" dans la ligne data, tu peux les passer en argument dasn l'appel de la fonction

onClick="makeRequest('ajax.php','conteneur','val_nom','val_prenom','val_age');"


ta fonction devient

function makeRequest(url,id_ecrire,nom1,prenom1,age1)

....

data = "prenom="+prenom1+"&nom="+nom1+"&age="+age1;
0
Hello,
C'est exactement ce que je souhaitais, je test cela ce soir et je vous tiens au courant, nickel et merci !
0
Hello,
J'ai essayé mais je dois vraiment être nul ça ne marche toujours pas ...

je vous donne tout mon code :

<!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(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('info').innerHTML="ok! <a href='index.php'>back</a>";
else
document.getElementById('info').innerHTML="Error code " + xhr.status;
}
};

xhr.open("POST", "nouvelle-personne.php", 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' />";
?>
<input type="button" value="Valider" onClick="submitForm(
<?php echo "ok,".$prenom.",".$nom.",".$lieu.",".$tel_fixe.",".$tel_portable.",".$adresse.",".$email.",".$date; ?>
);" />
<?php
echo "</form>";
echo "</div>";
}
}
?>

<div id="info"></div>
</body>
</html>


<?php

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");
mysql_query("INSERT INTO carnet VALUES ('', '$prenom', '$nom', '$lieu', '$tel_fixe', '$tel_portable', '$adresse', '$email', '$date')");
}

?>
0
Alain_42 pas d'idée ? je suis perdu ...

vct
0
Cc.
Suis-je dans les oubliettes déjà ?

A+ Vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
11 août 2008 à 15:28
Non je ne t'ai pas oublié mais j'étais absent

tu as déjà une erreur à cettte ligne il te manque tous les =

var data = "valide="+valide+"&prenom="+prenom+"&nom="+nom+"&lieu="+lieu+"&tel_fixe="+tel_fixe+"&tel_portable="+tel_portable+"&adresse="+adresse+"&email="+email+"&date="+date;
0
Hello,

Merci alain pour la petite correction j'avais pas fait attention.
Le problème persiste.

Si ça peut aider, quand je clic sur le bouton ma div info initialement comme cela :
<div id='info'></div>

...ne se rempli même pas par un message que j'ai défini dans le javascript :
document.getElementById('info').innerHTML="ok! <a href='index.php'>back</a>";
else
document.getElementById('info').innerHTML="Error code " + xhr.status;

Tous ces efforts pour apprendre l'ajax c'est dingue.

a+ vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
11 août 2008 à 18:23
c'est sur l'Ajax ce n'est pas simple.

xhr.open("POST", "nouvelle-personne.php", true);

quel est le code du script nouvelle-personne.php ?
0
Hello,
en fait j'ai deux pages :
index.php > formulaire qui envois les données vers nouvelle-personne.php
nouvelle-personne.php >donnée à valider avec un formulaire caché <input type="hidden"> et au clic sur le bouton j'appel l'ajax et j'envois les variables avec un valide=ok
dans la meme page je vérifie si il existe un valide et s'il est égale à ok et alors je fais la requete sql

Vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2008 à 13:00
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&eacute;ussi !";
	}else{
		echo "L'enregistrement a &eacute;chou&eacute; !";
	}
	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.
0
Hello,
wow merci pour cette tonne d'explication!
Je pensais pouvoir appeler une partie de la page elle même je ne pensais pas qu'il fallait qu'elle soit externalisée.

En ce qui concerne le fait qu'on peut s'enregistrer plusieurs fois, ne t'inquiète pas c'est un utilitaire qui me sert à moi même en guise de carnet d'adresse mais si j'en ais besoin je saurais le faire, merci.

Je test cela ce soir.
Bonne journée!
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2008 à 13:42
Ok je part faire qq courses

A+
0
C'est quand même incroyable, bien que j'ai fait un copié collé du code que tu viens de me donner, rien ne se passe : ni la requête et même pas l'affichage du texte "ok" ou "error".

Tu crois qu'on peut encore trouver un problème dans le code ou c'est la fin du monde ?

vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2008 à 18:32
Ok alors on va voir ce qui se passe en metant des alert javascript

pour 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){
				var reponse=http_request.responseText;
				alert("Reponse du script enregistrement.php: "+reponse);
				
				var obj=document.getElementById(id_ecrire);
				obj.innerHTML=reponse+" <a href='index.php'>back</a>";
			}else{
				var obj=document.getElementById(id_ecrire);
				obj.innerHTML=reponse;
			}
		}
	}

	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;
	alert ("valeurs envoyees: "+data);
	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 dis moi si les boites d'alert contienent bien les noms prenoms etc... attendus



ensuite pour tester ton script enregistrement.php, tu mets provisoirement des valeurs en dur à la place des $_POST['
puis tu appelles le script en tapant http/......../enregistrement.php directement dans ton navigateur
et tu verra bien si ça enregistre
0
Les boîtes d'alertes ne s'affichent même pas, à priori le js n'ait même pas appelé. D'ailleurs j'ai même mi une alerte au tout début de la fonction mais rien n'y fait.

Voici mon formulaire qui appel le js et j'ai supprimé les éléments de type <input type='hidden'> puisqu'ils ne servent à rien :

<form name="ma_form" method="post">

<input type="button"
value="Valider"
onClick="submitForm('enregistrement.php','info',<?php echo "ok,".$prenom.",".$nom.",".$lieu.",".$tel_fixe.",".$tel_portable.",".$adresse.",".$email.",".$date; ?>);" />

</form>

Vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2008 à 22:32
Bonsoir,

il faut rajouter des ' de part et d'autre des variables dans la ligne d'appel de la fonction comme ci dessous

attention il y a aussi une modif à faire dans la fonction, j'ai mis un commentaire

j'ai mis des valeurs bidon pour faire l'essai chez moi ça marche maintenant

notes qu'il faut coder les caractères accentués é = é


<!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){
			//attention j'ai modifie la ligne ci dessous
				var reponse=xhr.responseText;
				alert("Reponse du script enregistrement.php: "+reponse);
				
				var obj=document.getElementById(id_ecrire);
				obj.innerHTML=reponse+" <a href='index.php'>back</a>";
			}else{
				var obj=document.getElementById(id_ecrire);
				obj.innerHTML=reponse;
			}
		}
	}

	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;
	alert ("valeurs envoyees: "+data);
	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="";
}
*/
$prenom="Jules";
$nom="CESAR";
$lieu="Rome";
$tel_fixe="1234567890";
$tel_portable="0987654321";
$adresse="rue descendante";
$email="toto@orange.fr";
$date=date("Y-m-d H:i:s");
echo "<div id='conteneur'>";
echo "Pr&eacute;nom : ".$prenom."<br />";
echo "Nom : ".$nom."<br />";
echo "Lieu de connaissance : ".$lieu."<br />";
echo "T&eacute;l&eacute;phone fixe : ".$tel_fixe."<br />";
echo "T&eacute;l&eacute;phone portable : ".$tel_portable."<br />";
echo "Adresse : ".$adresse."<br />";
echo "Email : ".$email."<br />";
echo "Les donn&eacute;es sont correctes et je valide le nouveau membre du r&eacute;pertoire : ";
?>
<form name="ma_form" method="post">

<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>
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2008 à 23:09
Re,

je vois que tu as Firefox, alors utilises la console d'erreur du menu outils pour voir les erreurs éventuelles de javascript

dans mon precedent post il faut lire é = é suivi d'un point virgule

le code a été interprété.

@lain
0
Hello,
Les variables s'affichent correctement dans une boite d'alerte maintenant, que ce soit en dur ou par variable : nickel, le problème venait de l'absence de simple quote autour des variables à l'appel de la fonction javascript.

En revanche j'ai utilisé la console d'erreur et elle m'indique que cette ligne pose problème :
var reponse=http_request.responseText;

C'est bien le cas parce que c'est la seule boite d'alerte (déclarée la ligne suivante) qui ne s'affiche pas :
alert("Reponse du script enregistrement.php: "+reponse);

Par contre dans la base de donnée toujours rien et toujours aucun message qui ne s'affiche sur ma page après clic sur le bouton.

A bientôt,
Vct
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
19 août 2008 à 16:59
Salut, me voilà de retour de ma campagne.

En revanche j'ai utilisé la console d'erreur et elle m'indique que cette ligne pose problème :
var reponse=http_request.responseText;


C'était uncopier coller à partir d'une fonction à moi, je l'avais modifié dans la fonction et t'avais mis un commentaire

il faut que tu remplaces :
var reponse=http_request.responseText;

par var reponse=xhr.responseText;

Pour ce qui est de l'enregistrement dans la BDD, as tu fais l'essai en metant les valeurs "en dur" dans le script enregistrement.php
puis tu appelles le script en tapant http/......../enregistrement.php directement dans ton navigateur
et tu verra bien si ça enregistre

@lain
0
Hello,
Alain de retour, et dans quel ville tu étais pour ces vacances ? :)
D'accord je vais tester ce que tu me dis ce soir je pars faire des courses avant, à tout à l'heure : je te donnerai des nouvelles.

A+
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
19 août 2008 à 18:08
Ce ne sont pas vraiment des vacances mais une maison de campagne dans un petit village.

A+
0
Hello Alain.
Désolé hier soir je n'ai pu tester finalement.
Je vais essayer ce soir mais sans garantie car j'ai un rapport de projet à faire.
Je te tiens au courant...

Bonne journée,
Vincent.
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
20 août 2008 à 13:27
Sinon tu m'envoie les fichiers par mail en pièce jointe par MP
0
C'est bien gentil mais j'aimerais encore persévérer en pratiquant un peu mais si jamais je suis un cas de problème majeur et que ça ne marche pas après cette manipulation je te passerai la main :)

Vincent.
0
Hello Alain,
J'apporte de bonnes nouvelles!

L'ajax fonctionne.
Juste pour info j'ai remarqué que tu m'as remplacé "requete" par "requette" mais c'est mal orthographié. :)
J'avais changé http_request par xhr, et c'est évident que ça ne fonctionnait pas.

J'ai remplacé cela :

$query="INSERT INTO carnet VALUES ('', '".$prenom."','".$nom."','".$lieu."','".$tel_fixe."','".$tel_portable."','".$adresse."','".$email."','".$date.")";

Par

$query="INSERT INTO carnet VALUES ('', '$prenom','$nom','$lieu','$tel_fixe','$tel_portable','$adresse','$email','$date')";

...dans le fichier "enregistrement.php"

ET AUSSI

<input type="button" value="Valider" onClick="submitForm('enregistrement.php','info',<?php echo "'ok','".$prenom."','".$nom."','".$lieu."','".$tel_fixe."','".$tel_portable."','".$adresse."','".$email."','".$date."'"; ?>);" />


Par

<input type="button" value="Valider" onClick="submitForm('enregistrement.php','info',<?php echo "'ok','$prenom','$nom','$lieu','$tel_fixe','$tel_portable','$adresse','$email','$date'"; ?>);" />

...dans le fichier "nouvelle-personne.php"

D'un coup c'est bizarre j'adore l'ajax hihi,

Donne moi des nouvelles,
Vincent.
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
20 août 2008 à 18:37
Il manquait une petite ' juste avant la ) à la fin de:

$query="INSERT INTO carnet VALUES ('', '".$prenom."','".$nom."','".$lieu."','".$tel_fixe."','".$tel_portable."','".$adresse."','".$email."','".$date."')";


parce que ça devrait marcher avec cette methode

par contre pour la ligne <input c'est possible que ça gène

Si ça marche tant mieux pour toi

Et Ajax super !
0
Oui j'ai noté l'apostrophe qui manquait. tu crois que c'est ça qui bloquait ?
Maintenant nouvelle phase parmi l'ajax...
Pour l'affichage du carnet d'adresse je voudrais que le tableau qui me restitue les données de la base s'actualise lorsqu'il y a une nouvelle entrée dans la base, tu saurais m'aiguiller sur le principe ? Parce que de tête j'arrive pas à visualiser, je pensais juste a faire un refresh en en html toutes les x secondes mais du coup c'est géré par un temps et non d'après les nouvelles données entrées par un utilisateur.

Merci tout plein pour ton aide concernant le travail que tu as fournis, sans toi je n'en saurais rien et j'aurais probablement abandonné... et pourtant je me dois d'être informé de la technologie ajax je suis webmaster :)

Vincent.
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
20 août 2008 à 20:04
Bonsoir,

par le script enregistrement.php après la requette d'INSERT tu fais une requette SELECT

et la réponse viendra par Ajax

et tu écris cette réponse dans la page dans un div par .innerHTML
0