Discussion :

[ns_deux]

Bonjour � tous,
Voil� j'ai une page php avec un menu deroulant � partir d'une requete mysql et � cote un bouton-lien qui renvoie sur une nouvelle page php pour mettre � jour cette base si l'option n'est pas pr�sente dans le menu deroulant. Une fois le rajout effectu�, j'aimerais mettre � jour mon menu deroulant sans recharger ma page initiale.
Est-ce possible?
Merci d'avance.

[Eusebius]

Pas en PHP : une ex�cution en PHP est toujours sur le serveur, donc il faut un rechargement.

Ajax peut sans doute faire ce que tu recherches.

[ns_deux]

Je sais j'ai dej� un fonction ajax mais elle fonctionne pas pour ce menu deroulant voila mon 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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
 
<script type="text/javascript">
function getElement(id) 
{
	var Elem;
 
	if(document.getElementById) 
	{
		if (typeof document.getElementById(id) == "object") 
			Elem = document.getElementById(id);
				else 
					Elem = void(0);
	} 
	else if(document.all) 
	{
		if (typeof document.all[id] == "object") 
			Elem = document.all[id];
				else 
					Elem = void(0);
	} 
	else if(document.layers) 
	{
		if (typeof document[id] == "object") 
			Elem = document[id];
				else 
					Elem = void(0);
	}
	else Elem = void(0);
 
	return Elem;
}
 
 
var xhr = null;
 
function getXhr()
{
	if (window.XMLHttpRequest) 
	{
		xhr = new XMLHttpRequest();
	}
	else if (window.ActiveXObject)  // if IE
	{ 
		var ieversions = ['Msxml2.XMLHTTP',
						  'Microsoft.XMLHTTP',
						  'Msxml2.XMLHTTP.5.0',
						  'Msxml2.XMLHTTP.4.0',
						  'Msxml2.XMLHTTP.3.0'
						 ]; 
 
		for(var i=0; !xhr && i<ieversions.length; i++) 
		{ 
			try
			{
				xhr = new ActiveXObject(ieversions[i]);
			} 
			catch(e) 
			{ 
				xhr = null;
			}
		}
	}
 
	if(!xhr)// XMLHttpRequest non supporté par le navigateur
		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
}
 
 
/**
* Méthode qui sera appelée sur le click du bouton
*/
function requete(page,select,form,target,target1,target2,target3,target4)
{
	getXhr();
 
	xhr.onreadystatechange = function()
	{
		if(xhr.readyState == 4)
		{		
		if(xhr.status == 200 || xhr.status == 304)
			eval(xhr.responseText);
		}
	};
 
	xhr.open("POST",page,true);
	xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	xhr.send("form="+escape(form)+"&type="+escape(select.id)+"&id="+escape(select.value)+"&target="+escape(target)+"&target1="+escape(target1)+"&target2="+escape(target2)+"&target3="+escape(target3)+"&target4="+escape(target4));
}
</script>
 
.........
 
 
<select name="oam" id="oam" onClick="javascript:requete('requete_oam.php',this,'formulaire');"  />
        <?php
        $oam=$_GET["oam"];
        echo '<option value="'.$oam.'">'.$oam.'</option>';
        while ($row1= mysql_fetch_array($result1, MYSQL_ASSOC)) 
        {$var1= $row1["oam"];
        echo '<option value="'.$var1.'">'.$var1.'</option>';
        }
        ?>
	</select>

Ca c ma page principale. et voila le code de ma page requete_oam.php

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
50
51
52
53
54
55
56
57
 
 
<?php
 
 
if(!empty($_POST) || !empty($_GET))
{
	if(isset($_POST['type']))
		$type = strip_tags($_POST['type']);
			elseif(isset($_GET['type']))
				$type = strip_tags($_GET['type']);
					else
						$type = '';
 
	if(isset($_POST['id']))
		$id = strip_tags($_POST['id']);
			elseif(isset($_GET['id']))
				$id = strip_tags($_GET['id']);
					else
						$id = '';
 
	if(isset($_POST['form']))
		$form = strip_tags($_POST['form']);
			elseif(isset($_GET['form']))
				$form = strip_tags($_GET['form']);
					else
						$form = '';
 
 
 
 
 
	require("connect_atelier.php");
 
 
	if($type == 'oam')
	{
		if($id != '')
		{
			$req = 'SELECT oam FROM oam WHERE oam="'.$id.'"';   
			$res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );  
			echo "<select name='oam' id='oam'>";
		        echo '<option value=""></option>';
       			while ($row= mysql_fetch_array($res, MYSQL_ASSOC)) 
       			{$var1= $row["oam"];
       			echo '<option value="'.$var1.'">'.$var1.'</option>';  
       			echo "</select>";
       			}
 
 
		}
 
 
 
	}
}
?>

mais ca marche pas pour le menu deroulant. la fonction fonctionne pour d'autre element donc c vient pas de ma fonction mais putot de ma page requete_oam.php je pense
Merci d'avance

[berceker united]

J'ai pas regard� ton code parce que j'ai la fleme grave surtout un lundi. Je peux te dire que �a fonctionne. Tu as deux moyen.
1 : tu fabrique de toute piece ton menu select cot� client et le menu select actuel est plac� dans un div. AJAX va appel� le fichier php qui va g�n�rer le code html du select et va afficher le contenu dans le div contenant l'ancien select.
2 : Soit tu alimentes le select en construisant les fonctionns javascript cot� client. En faite c'est php qui genere cette fonction. Je t'avous que je me rappelle plus trop comment ajouter un �l�ment d'un select mais c'est facile � trouver.

Edit apres avoir eu le courage de lire une partie de ton code tu as pris la premiere solution. Je crois que ton eval ne va pas fonctionner. fait ceci

//mondiv c'est le div contenant l'ancien <select>.

document.getElementById(mondiv).innerHTML = xhr.responseText;

[ns_deux]

J'ai essaye ton truc mais ca ne marche pas j'ai surement une erreur dans mon code voil� une partie de mon script:

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
 
	function go(){
				getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
 
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('oam').innerHTML = xhr.responseText;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("GET","requete_oam.php",true);
				xhr.send(null);
			}
 
................
 
voilà mon select : 
 
 
<div id='oam' style='display:inline' onclick='go()'>
      <select name='oam' id='oam' style="width:240" >
        <option value=''></option>
      </select>
      </div>

et voila le code de ma requete_oam.php

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php
        echo "<select name='oam' id='oam' style='width:240'>";
        echo "<option value=''></option>";
        require("connect_atelier.php");
        $req = 'SELECT DISTINCT oam FROM oam ';   
        $res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
        while($row = mysql_fetch_assoc($res)){
                echo "<option value='".$row["oam"]."'>".$row["oam"]."</option>";
                }
        echo "</select>";  
?>

Merci encore

[berceker united]

Dans l'id�e c'est �a .
- As-tu execut� le fichier requete_oam.php seul pour voir s'il y avait pas une erreur cot� php ?
- As-tu test� qu'il rentrait bien dans

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

if(xhr.readyState == 4 && xhr.status == 200){

- As-tu test� que le div re�oit bien le contenu ?

- As-tu fais le test sous FireFox et regard� dans le debuger de ce dernier ?

[ns_deux]

- As-tu execut� le fichier requete_oam.php seul pour voir s'il y avait
pas une erreur cot� php ?

--> oui et il me donne bien la liste des mes oam

------------------------------------------------------------------------

- As-tu test� qu'il rentrait bien dans
if(xhr.readyState == 4 && xhr.status == 200)

--> je sais pas faire c�

------------------------------------------------------------------------

- As-tu test� que le div re�oit bien le contenu

--> oui. par contre, il m'affiche un autre select dans lequel je peux pas cliquer. A mon avis mon go() ne devrais pas etre dans mon div. Enfin je crois.

------------------------------------------------------------------------

- As-tu fais le test sous FireFox et regard� dans le debuger de ce
dernier

--> oui. aucun bug sous firefox

[ns_deux]

J'ai modifi� deux trois trucs et ca marche presque. par contre le select ne veut pas garder l'element selectionner et s'efface de suite.
Voil� le code modifier :

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
	function go(){
				getXhr();
				// On d�fini ce qu'on va faire quand on aura la r�ponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout re�u et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
					
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('divoam').innerHTML = xhr.responseText;
					}
				}

				// Ici on va voir comment faire du post
				xhr.open("GET","requete_oam.php",true);
				xhr.send(null);
			}

................



<div id='divoam' onClick='go()'>
      <select name='oam' style="width:240" >
      </select>
      </div>

[berceker united]

Quel est le sc�nario ?
- Tu s�lectionnes un �l�ment de ton <select> et le contenu de ce m�me <select> change ?
Tu stocke la valeur s�lectionn� dans une variable et lorsque l'ajax fait son travail tu affecte la cette variable � la "value" du select.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.getElementById('oam').value = varTemp;

Attention tu n'as pas plac� d'id dans ton menu .

- Si �a provient d'autre <select> tu prend �a valeur et tu l'affecte � oam apres qu'Ajax ait fait son boulot.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.getElementById('autreselect').value = document.getElementById('oam').value;

[ns_deux]

Et bien en faite, quand je cliques sur mon select et que je lache, le mecu disparait. Par contre, quand je maintiens le click, j'ai bien mon menu avec les modif mais je ne peux rien selectionner. Ca s'efface aussitot et le select redevient vierge.
Pourquoi?

[berceker united]

tu n'as pas un autre evenement de type onmouseup ? qui fonction en g�n�rique ?

[ns_deux]

Ca marche pas mieux avec onMouseUp et ca marche plus du tout si je mets onChange.
Tout s'efface aussitot. Bizarre
J'y comprends rien

[berceker united]

C'est bizarre car j'ai l'impression que ton div est a nouveau affect� mais � quelque chose de vide. Peut �tre que c'est la page php qui genere le select qui se recharge � vide mais fais un test de ton div apres toute op�ration AJAX
alert(document.getElementById(ton div).innerHTML)
ou
Le style='display:inline' qui se trouve dans le div qui ma fois ne sert pas l�.

haa surement trouv�! tu as le m�me nom d'id pour <div> et ton <select>

[ns_deux]

voila le message apres avoir fait ce que tu as dit :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
<select name='oam' id='oam' style='width:240;'>
<option value=''></option>
</select>

[FremyCompany]

haa surement trouv�! tu as le m�me nom d'id pour <div> et ton <select>

+1

[ns_deux]

Non je l'ai modifi� ca dej� desole.....
je vous redonne l'ensemble mais je pense pas que ca change grand chose regardez....

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
 
function recharge(page,val){
				getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
 
						// On se sert de innerHTML pour rajouter les options a la liste
					document.getElementById('div'+val).innerHTML = xhr.responseText;
					}
				}
 
				// Ici on va voir comment faire du Get
				xhr.open("GET",page,true);
				xhr.send(null);
}
 
..............................................
 
<div id='divoam' onClick='recharge("requete_oam.php","oam")'>
      <select name='oam' id='oam' style="width:240" >     
      <option value=''></option>
      </select>
      </div>

et la pas requete_oam.php

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
 
<?php
        echo "<select name='oam' id='oam' style='width:240'>";
        echo "<option value=''></option>";
        require("connect_atelier.php");
        $req = 'SELECT DISTINCT oam FROM oam ';   
        $res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
        while($row = mysql_fetch_assoc($res)){
                echo "<option value='".$row["oam"]."'>".$row["oam"]."</option>";
                }
        echo "</select>";  
?>

[ns_deux]

"C'est bizarre car j'ai l'impression que ton div est a nouveau affect� mais � quelque chose de vide. Peut �tre que c'est la page php qui genere le select qui se recharge � vide mais fais un test de ton div apres toute op�ration AJAX
alert(document.getElementById(ton div).innerHTML)
ou
Le style='display:inline' qui se trouve dans le div qui ma fois ne sert pas l�."

fonction modifi�e :

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
 
function recharge(page,val){
				getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
 
						// On se sert de innerHTML pour rajouter les options a la liste
						alert(document.getElementById('div'+val).innerHTML);
						//document.getElementById('div'+val).innerHTML = xhr.responseText;
					}
				}
 
				// Ici on va voir comment faire du Get
				xhr.open("GET",page,true);
				xhr.send(null);
}

et voil� le resultat sur le pop up

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
<select name="oam" id="oam" style="width:240;" >     
      <option value=""></option>
      </select>

En fait il reprends les infos de la page principale et pas celle de ma requete.

[ns_deux]

Par contre ce qui est bizarre ce que lorsque je modifie mon code comme c� :

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
function recharge(page,val){
				getXhr();
				// On d�fini ce qu'on va faire quand on aura la r�ponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout re�u et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
					
						// On se sert de innerHTML pour rajouter les options a la liste
					        alert(xhr.responseText);
						//document.getElementById('div'+val).innerHTML = xhr.responseText;
					}
				}

				// Ici on va voir comment faire du Get
				xhr.open("GET",page,true);
				xhr.send(null);
}

Voila la reponse :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
 
<select name="oam" id="oam" style="width:240;" >     
      <option value=""></option>
 <option value="valeur1">valuer1</option>
 <option value="valeur2">valeur2</option>
 <option value="valeur3">valeur3</option>
      </select>

Bref toutes les valeurs de ma requete et donc le resultat attendu mais il n'est pas affect� � document.getElementById('div'+val).innerHTML....
Je comprends pas

[berceker united]

Je t'avouerais que je ne comprend, l� j'�tais en train de faire un peut d'AJAX pour controler mes champs mais je fais un peut pret la m�me chose que toi et capte pas pourquoi. Au lieu de le placer dans le dive tu fais

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

eval(xhr.responseText);

ton div est egal � divoam ?

[ns_deux]

Excuse moi mais j'ai pas compris ce que tu me demandes faire l� avec le :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
eval(xhr.responseText);

Desole, je debute.
l'id de mon div est bien : divoam.