[AJAX] Formulaire et affichage dans une DIV

**guillaume-13015** · 16/02/2015, 14h22

Bonjour,

Je dois actuellement créer un formulaire avec des cases à remplir et ensuite afficher le résultat dans une DIV (via $_GET de PHP) ce qui n'est pas un problème, mais ce que je souhaite c'est que lorsqu'on clique sur valider, cela ne recharge pas la page où se trouve le formulaire, mais "charge" la page de traitement dans une DIV ( dans mon cas elle s'appelle : 'droite') avec les arguments GET (ou même POST) .

J'ai déjà réussi avec du javascript et XMLHttpRequest (avec quelque chose comme : document.getElementById("droite").innerHTML = xmlhttp.responseText). Cela marche bien mais mes $_GET ne sont pas envoyés (donc j'ai abandonné ce système) .

J'ai simplifié mon code au maximum :

Index.php

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<html>
<head>
</head>
 
<body>
	<form action="recherche.php" method="GET" id="rechercher">
		<table>
		<tr>
			<td> <input type="text" placeholder="H" size="4" /> X </td> 
			<td> <input type="text" placeholder="L" size="4" /> </td>
			<input type='submit' value='Valider' id='submit-button' name='ok' /> 
		</tr>
		</table>
	</form>
 
	<div id="droite">
	<!-- DIV DES RÉSULTATS-->
	</div>
 
 
</body>
</html>

recherche.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<?php 
print_r($_GET);
print_r($_POST);
?>

Comment faire ?

Merci d'avance de vos réponses.

Cordialement,

**NoSmoking** · 16/02/2015, 15h05

Bonjour,
pas sûr d'avoir réellement compris ton besoin attendu que visiblement tu à tout réussi à faire marcher

Il semblerait que ta première démarche soit la bonne, utilisation de l'Ajax alors que te dire de plus...sinon que je déplace sur le forum Ajax.

**guillaume-13015** · 16/02/2015, 17h01

merci pour le déplacement,

je pense avoir réussi après des heures de recherches... j'ai récupéré ce que j'avais trouvé pour l'AJAX et après j'ai rajouter la construction mon url en fonction des champs INPUT de la page:
voici le code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
<script type="text/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;
}
 
function AJAX(url){
    xhr_object = getXMLHttpRequest();
 
    xhr_object.open("POST", url, false);
    xhr_object.send(null);
    if(xhr_object.readyState == 4){
        return xhr_object.responseText;
    }else return(false);
}
 
 
function submitForm(){
   	var x = document.getElementsByTagName("input");
	var url = "recherche.php?";
    var i;
    for (i = 0; i < x.length; i++) 
	{
    document.getElementById('droite').innerHTML += x[i].name;
 
	url+=x[i].name+'='+x[i].value;
	if(i+1<x.length)url+='&';
    }
 
    document.getElementById('droite').innerHTML = AJAX(url);
}
</script>

et sur le bouton je fais un onclick="submitForm()"

si ça peux aider d'autres personnes...

[AJAX] Formulaire et affichage dans une DIV

AJAX

Discussions similaires

Partager

Partager