Discussion :

[gto6911]

Bonjour tout le monde,

Par avance je tiens à m'excuser si je ne poste pas au bon endroit, c'est ma première visite sur le site.
Deuxièment, il faut savoir que je suis débutante en JS

Je vous expose mon problème.
J'ai une liste déroulante alimenté par ma bdd. A côté, j'ai un champ texte et un bouton Ajouter.
J'aimerais que lorsque je rentre quelque chose dans mon champ texte et que j'appuye sur le bouton, tout cela est envoyé dans ma liste déroulante sans rechargement de page.
Mon souci :

L'ajout se fait bien, mais il faut que j'appuye sur F5 pour le voir dans ma liste déroulante. Il n'y à pas de rechargement de ma liste déroulante.

Je vous présente les trois parties de mon code :

Partie JS :

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
	var xhr = null; 
 
			function getXhr(){
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject){ // Internet Explorer 
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
			}
			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){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('NomFourn').value = leselect;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","AjaxFournisseur.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id de l'utilisateur
				idAjout = document.getElementById('Ajout').value;
				//idAjout = sel.options[sel.selectedIndex].value;
				xhr.send("idAjout="+idAjout);
 
			}

La partie php qui traite les requête d'ajout et de select pour refaire ma liste déroulante :

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
<?php
$Ajout=$_POST["idAjout"];
print($Ajout);
        echo("<SELECT name=\"Matricule\" id=\"NomFourn\" >");
        if(isset($_POST["idAjout"]))
        {
                $Ajout=$_POST["idAjout"];
                
                $Id = odbc_connect ( "reseau" ,  "reseau", "clf" ) ;
                $Req=" INSERT INTO Fournisseur(Nom_Fourn) VALUES('$Ajout')";
                odbc_do($Id, $Req ) ;
                $Req2=" SELECT * from Fournisseur ";
                $result2 =odbc_do($Id, $Req2 ) ;
                print($Req2);
                while(odbc_fetch_row($result2))
                {
                                $NomFourn=trim(odbc_result($result2, 1));
                                echo "<option value=\"$NomFourn\">\"$NomFourn\"</option>";
                                                                                                
                }
 
                echo("</select>");
        }
        else
        {
        
                echo("impossssiiiiiiiiiiibbbbbbbbbbbbleeee");
        }
 
        
?>

Et enfin la petite partie du formulaire qui est associé :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
echo ( "<TD><SELECT name=\"NomFourn\" id=\"NomFourn\">");
				echo("<OPTION> $NomFourn");
					$Req4=" SELECT Nom_Fourn FROM Fournisseur WHERE Nom_Fourn <> ''";
					$result4 =odbc_do($Id, $Req4 ) ;
						while(odbc_fetch_row($result4))
					{
							$NomFourn=odbc_result($result4, 1);
							sqlchaineLire($Nom_Fourn);
							echo("<OPTION> $NomFourn");
					}
      	echo("</SELECT>");
		echo("<INPUT type=\"text\" name=\"Ajout\" id=\"Ajout\"  size=\"20\">");
		echo("<input type=\"button\" value=\"Ajout\" onClick=\"go()\"></TD>");

Merci d'avance pour votre aide

[andry.aime]

Bonjour,

document.getElementById('NomFourn').value = leselect;

echo("<SELECT name=\"Matricule\" id=\"NomFourn\" >");

echo ( "<TD><SELECT name=\"NomFourn\" id=\"NomFourn\">");

Un id doit être unique dans un document.
On peut voir ton code HTML?

J'aimerais que lorsque je rentre quelque chose dans mon champ texte et que j'appuye sur le bouton, tout cela est envoyé dans ma liste déroulante sans rechargement de page.

Tu peux simplement ajouter une option dans le select avec DOM quand l'insertion dans la base suite à la requête AJAX s'est effectué avec succés.

Code :

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

1
2
 var option = new Option("Text","Valeur");
document.getElementById('idDuSelect').options[document.getElementById('idDuSelect').length]=option

[gto6911]

Tu peux simplement ajouter une option dans le select avec DOM quand l'insertion dans la base suite à la requête AJAX s'est effectué avec succés

Je dois rajouter ce code dans mon JS? et pour le "texte" et "valeur" je dois donc passer des variables. Je peux directement mettre l'id de mon champ texte?

Et je suis surement tête en l'air, mais mon code html? j'ai pourtant mis tout mon code içi.

[andry.aime]

Je dois rajouter ce code dans mon JS? et pour le "texte" et "valeur" je dois donc passer des variables. Je peux directement mettre l'id de mon champ texte?

J'ai dis ça pour éviter que tu recrées ton select depuis le serveur.

Et je suis surement tête en l'air, mais mon code html? j'ai pourtant mis tout mon code içi.

Je parle du code HTML généré dans le code source de ton navigateur. Tu nous as montrés le code PHP et Javascript.

A+.

[gto6911]

J'allais justement éditer mon dernier post pour dire que ca y est cela fonctionne grâce à ta méthode.
Je te remercie vraiment beaucoup. Cela faisait une semaine que je planchais.
Encore merci !!!!