Salut à tous,

J'ai recemment commencé mon apprentissage Ajax, j'utilise particulierement cette fonction :

function Ajax(_IDDiv,_Cible)
{
	var req = null; 
	
	if (window.XMLHttpRequest)
		{
			req = new XMLHttpRequest();
			if (req.overrideMimeType)
				{
					req.overrideMimeType('text/xml');
				}
		}
	else if (window.ActiveXObject)
		{
			try
				{
					req = new ActiveXObject("Msxml2.XMLHTTP");
				}
			catch (e)
				{
					try
						{
							req = new ActiveXObject("Microsoft.XMLHTTP");
						}
					catch (e)
						{
							document.getElementById(_IDDiv).innerHTML = "Erreur lors de la création de l'objet XMLHttpRequest...";
						}
				}
		}
	
	req.onreadystatechange = function()
		{		
			// Terminée
			if (req.readyState == 4)
				{
					if (req.status == 200)
						{
							document.getElementById(_IDDiv).innerHTML = req.responseText; // responseXml
						}
					else if (req.status == 404)
						{
							document.getElementById(_IDDiv).innerHTML = "La page n'a pas été trouvée...";
						}
					else
						{
							document.getElementById(_IDDiv).innerHTML = "Erreur : " + req.status + " " + req.statusText;
						}
				}
		};
	
	req.open("GET", _Cible, true); // P1 (mode) : GET ou POST, P2 : URL, P3 : Asynchrone -> true / Synchrone -> false
	req.send(null); // P1 : GET -> null / POST -> données à envoyer au serveur
	
	//window.setTimeout('Ajax(\'whosonline\',\'ajax.php?ligne=1\')',2000);
	//window.setTimeout('Ajax("'+_IDDiv+'","'+_Cible+'")',2000);
}

Elle me permet de faire des raffraichissement de div sans modifier le contenu entier de la page.

_IDDiv correspond à la div que l'on va modifier avec le contenu obtenu via _Cible (generalement du traitement dans une page ajax.php).

A l'heure actuelle, j'aimerais remplir un formulaire en POST, et entrer le contenu du formulaire dans la base de donnée sans raffraichir ma page.
J'ai essayer de bidouiller cette fonction, mais je ne comprends pas ou est ce que je recupere mon POST. Dans ma fonction, je specifie une cible dans laquelle je fais mes traitements. Avec la fonction POST je n'ai aucun moyen de traiter le resultat.

J'espere avoir été clair. SVP un petit peu d'aide =)

Merci à tous !

Minkow.

Pourquoi tu ne pourrais pas traiter tes données? Pour faire du "POST" avec ajax c'est pas plus compliquer! tu change ton GET par POST et ensuite dans ton req.send tu envois tes variables un peu comme ça:

var donnees = "var1="+ valeurVar1 +"&var2="+valeurVar2;
req.send(donnees);

Page de traitement standard:

<?php
   if(isset($_POST['var1']) && isset($_POST['var2'])){
      // Suite du traitement
   }
?>

Je sais pas si j'ai bien compris xD

Ah et donc je ne touche pas au req.open alors sauf pour mettre POST à la place de GET ? =D

Ensuite j'ai une question, coté html, je met quoi dans mon action de form ?

<form method='POST' action='?'>

=O

Ah oui et aussi, je fais comment pour specifier que tel <input type='text' name='x'> prend val1 ou val2 ?
Mon idée aurait été d'attribué un id à chaque input et de faire document.getelementbyid, je dois proceder comme ca ?

En fait tu n'as pas besoin de spécifier une valeur à "action=" dans ton form puisque tu passe par Javascript et AJAX donc quand tu clic sur le bouton d'envoi tu récupère toutes les infos de ton formulaire soit comme tu l'as dis en mettant un ID soit par une autre méthode qui te permet de sélectionner le formulaire et tous ses éléments.

Par contre pour ton val1 ou val2 j'ai pas trop compris! Tu veux mettre une valeur par défaut? (en gros quand la page se charge pour la première fois, il y a déjà un truc d'écrit dedans)

Nan nan en fait je voulais juste affecter la valeur entrée dans <input type='text' name='xxx' id='blablabla'> directement dans var 1.

J'ai bien le droit de faire :

var donnees = "var1="+ document.getelementbyid("blabla");
req.send(donnees);

??? =D

Plus comme ceci:

var donnees = "var1="+ document.getElementById("blabla").value;
req.send(donnees);

Dac ! Merci pour le .value :p.

Probleme résolu dans ce cas ! Merci encore

EDIT : Probleme pas tout à fait résolu en fait xD

Voila ma fonction :

function AjaxPost(_IDDiv,_IDCible,_Cible)
{
	var req = null; 
	
	if (window.XMLHttpRequest)
		{
			req = new XMLHttpRequest();
			if (req.overrideMimeType)
				{
					req.overrideMimeType('text/xml');
				}
		}
	else if (window.ActiveXObject)
		{
			try
				{
					req = new ActiveXObject("Msxml2.XMLHTTP");
				}
			catch (e)
				{
					try
						{
							req = new ActiveXObject("Microsoft.XMLHTTP");
						}
					catch (e)
						{
							document.getElementById(_IDCible).innerHTML = "Erreur lors de la création de l'objet XMLHttpRequest...";
						}
				}
		}
	
	req.onreadystatechange = function()
		{		
			// Terminée
			if (req.readyState == 4)
				{
					if (req.status == 200)
						{
							document.getElementById(_IDCible).innerHTML = req.responseText; // responseXml
						}
					else if (req.status == 404)
						{
							document.getElementById(_IDCible).innerHTML = "La page n'a pas été trouvée...";
						}
					else
						{
							document.getElementById(_IDCible).innerHTML = "Erreur : " + req.status + " " + req.statusText;
						}
				}
		};
	
	req.open("POST", _Cible, true); // P1 (mode) : GET ou POST, P2 : URL, P3 : Asynchrone -> true / Synchrone -> false
	var donnees = "message="+escape(document.getElementById(_IDDiv).value);
	req.send(donnees);
}

Voila ma page de traitement :

<form method='POST'>
				<input type='text' id='toto'>
				<input type='button' value='Envoyer' onclick=\"AjaxPost('toto','x','ajax.php?option=test')\">
			</form>
				<div id='x'>
					
				</div>";

Ma page de résultat ajax.php ne contient qu'un echo $_POST["message"]. Il ne fonctionne pas. J'ai essayé de modifier au maximum, j'ai regardé rapidement sur le net, et j'ai pas trouvé bien concluant.

Note : toto est l'id que je veux récupérer
x est la div dans laquelle je veux afficher le contenu de toto
$_POST["message"] est la variable qui contient le message écris.

Je minimise le probleme, par la suite je ferais des modifs dans la BDD c 'est pourquoi j'utilise cette solution. Pour l'instant, je me familiarise juste.

Apparemment j'ai un soucis avec document.getElementById().value, je ne peux pas l'afficher dans un alert sur onclick, il ne me renvoit rien. Je ne peux pas non plus traiter l'information, puisque la requete ne s'effectue pas comme il faut.

Merci =)

Si tu veux essayer certaine chose il FAUT que tu TEST au fur et a mesure.
Je vais testé de mon côté pour voir.
Mais déjà écrit une fonction test qui va faire un alert de tes variables pour voir si elles passent bien.

EDIT: Voila ce que j'ai pu faire en mode POST:

// Créer l'objet XHR
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;
}

// Fait appel au fichier php de traitement
function AJAX(url,variable,_id) {
   
	var xhr;
	try { xhr = getXMLHttpRequest(); }
	catch (e){
		xhr = new ActiveXObject(Microsoft.XMLHTTP);
	}  
 	xhr.onreadystatechange = function () {
		if (xhr.readyState == 4){
			if (xhr.status == 200)
				document.getElementById(_id).innerHTML = xhr.responseText;
        	else
				alert(xhr.status);
		}else
			document.getElementById(_id).innerHTML = "Erreur XHR!";
	}

	xhr.open('POST', url, true);
	xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 	xhr.send('ok=' + variable);
}

Et la page de traitement pour le test:

<?php

if(isset($_POST['ok']) && !empty($_POST['ok'])){
	if($_POST['ok'] == '1')
		echo "La variable a bien été posté par ajax en mode POST!";
}else{
	echo "La variable n'existe pas ou est vide!";
}

?>

Ma fois merci pour le bout de code, mais j'aimerais savoir pourquoi le mien ne fonctionne pas.

J'ai fais des alert pour afficher le contenu de ma variable donnée, j'ai rajouté ta ligne concernant le Content machin truc. L'alert sur le contenu de ma variable marche très bien, j'ai bien "message=xxxx".

Seulement, c'est ma requete qui ne s'execute pas comme il le faut. je ne recois aucun $_POST...

Pour être honnête je ne suis pas encore calé en en AJAX donc je ne saurais te répondre sur le pour quoi du comment

Néanmoins sa ma donné envie de découvrir pour quoi

Toujours rien de mon coté niark

Prend exactement le code que je t'ai donné et met le tel quel dans ton code à toi.