Discussion :

[Equinoxe5]

Bonjour,
J'explique déjà le but de ma requête. Ce sera plus simple.
Je veux entrer les coordonnées d'un match (Equipe A contre equipe B) suivant la catégorie (juniors, seniors etc etc...)
Donc je commence à entrer la catégorie et ensuite, les listes déroulantes sont censées donner la liste des équipes correspondant à cette catégorie.
Ca fonctionne bien pour l'équipe A mais la liste de l'équipe B est vide.
Ce que je souhaite c'est que les 2 listes soient identiques.
Voici le bout de code (récupéré sur le net)

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
<script type='text/javascript'>
        function getXhr(){
        var xhr = null; 
        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 {
  alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
  xhr = false; 
  }
                return xhr;
 }
         function go(){
         var xhr = getXhr();
         xhr.onreadystatechange = function(){
         if(xhr.readyState == 4 && xhr.status == 200){
  leselect = xhr.responseText;
  document.getElementById('equipe').innerHTML = leselect;
  }
 }
 xhr.open("POST","../equipe.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('abrev');
 choix = sel.options[sel.selectedIndex].value;
 xhr.send("abrev="+choix);
 }
</script>

Ensuite, voici la liste déroulante 1 qui fonctionne

Code :

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

1
2
3
4
5
    <div id='equipe' style='display:inline'>
     <select name="equipe1">
     <option selected></option>
     </select>
    </div>

Mais je ne sais pas quoi mettre dans la liste déroulante 2. Si je mets le même code que dans la 1, ça ne fonctionne pas. la liste 2 reste vide

Vous pouvez m'aider ou me donner un exemple svp ?

[Equinoxe5]

Bon j'ai trouvé: J'ai rajouté la ligne en gras

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
<script type='text/javascript'>
        function getXhr(){
        var xhr = null; 
        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 {
  alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
  xhr = false; 
  }
                return xhr;
 }
         function go(){
         var xhr = getXhr();
         xhr.onreadystatechange = function(){
         if(xhr.readyState == 4 && xhr.status == 200){
  leselect = xhr.responseText;
  document.getElementById('equipe1').innerHTML = leselect;
  document.getElementById('equipe2').innerHTML = leselect;
  }
 }
 xhr.open("POST","../equipe.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('abrev');
 choix = sel.options[sel.selectedIndex].value;
 xhr.send("abrev="+choix);
 }
</script>

et les 2 div:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
    <div id='equipe1' style='display:inline'>
     <select name="equipe1">
     <option selected></option>
     </select>
    </div>
 
et
 
    <div id='equipe2' style='display:inline'>
     <select name="equipe2">
     <option selected></option>
     </select>
    </div>

De ce fait, ça m'ouvre bien 2 listes identiques à partie de la première

[E.Bzz]

Bonjour,
bravo pour l'auto-résolution

Par contre, tu ne devrais pas donné aux div un id qui correspond aux name des select : en effet IE a du mal à distinguer id et name et ça pourrait poser problème ...

A+

[Equinoxe5]

Merci de ton conseil,

Mais finalement ma solution ne me convient pas et je suis donc parti sur autre chose. Le principe de départ est toujours le même, -> une categorie de joueurs -> 2 listes déroulantes avec les équipes de la catégorie présélectionnée.
Voilà le code pour la partie ajax.

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
<script type='text/javascript'>
        function getXhr(){
        var xhr = null; 
        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 {
  alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
  xhr = false; 
  }
                return xhr;
 }
 
function go(){
var xhr = getXhr();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
   leselect = xhr.responseText;
   document.getElementById('equipe1').innerHTML = leselect;
   }
}
 xhr.open("POST","../equipe1.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('categorie');
 choix = sel.options[sel.selectedIndex].value;
 xhr.send("categorie="+choix);
 }
 
function go2(){
var xhr = getXhr();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
 leselect = xhr.responseText;
   document.getElementById('equipe2').innerHTML = leselect;
   }
}
 xhr.open("POST","../equipe2.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('categorie');
 choix = sel.options[sel.selectedIndex].value;
 xhr.send("categorie="+choix+"&equipe1="+equipe1); <--- envoi equipe1

 }
</script>

Voilà le code qui génère la 1ere liste et le div correspondant:

Code :

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

<select name='categorie' id='categorie' onchange='go()'>

et

Code :

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

1
2
3
4
5
    <div id='equipe1' style='display:inline'>
     <select name='equipe1'>
     <option selected>Equipe locaux</option>
     </select>
    </div>

le fichier php qui génère la première liste des équipes:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
        header('Content-Type: text/html; charset=ISO-8859-1');          // Pour avoir les lettres accentuees dans le formulaire
        echo "<select name='equipe1' id='equipe1' onchange='go2()'>";
         echo "<option value=\"\"></option>";
         require ("./config/config.inc.php");
         $query = "SELECT categorie, equipe FROM classement_des_equipes WHERE categorie='".$_POST['categorie']."' ORDER BY equipe ASC";
         $result = mysql_query($query) or die('Erreur SQL !'.$sql.''.mysql_error());;
         while($row = mysql_fetch_array($result))
         {
         echo"<option value=\"".$row['equipe']."\">".$row['equipe']."</option>";
         $equipe1=$row['equipe'];
         }
 echo "</select>";
?>

Ensuite le second div

Code :

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

1
2
3
4
5
   <div id='equipe2' style='display:inline'>
     <select name='equipe2'>
     <option selected>Equipe visiteurs</option>
     </select>
    </div>

et le fichier php qui génère la 2eme liste d'équipes

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
        header('Content-Type: text/html; charset=ISO-8859-1');          // Pour avoir les lettres accentuees dans le formulaire
        echo "<select name='equipe2' id='equipe2'>";
         echo "<option value=\"\"></option>";
         require ("./config/config.inc.php");
         $query = "SELECT categorie, equipe FROM classement_des_equipes WHERE categorie='".$_POST['categorie']."' AND equipe <> '".$_POST['equipe1']."' ORDER BY equipe ASC";
         $result = mysql_query($query) or die('Erreur SQL !'.$sql.''.mysql_error());;
         while($row = mysql_fetch_array($result))
         {
         echo"<option value=\"".$row['equipe']."\">".$row['equipe']."</option>";
         $equipe2=$row['equipe'];
         }
 echo "</select>";
?>

Voici mon problème:
Dans cette 2ème liste, je souhaiterais avoir les mêmes équipes que dans la première SAUF celle sélectionnée dans la 1ère puisque une équipe ne se rencontre pas :-)
J'ai donc essayé d'envoyer le paramètre equipe 1 (que j'ai mis en gras dans mon code ajax) mais sans succès. Voilà ce que donne la requête de ma liste 2

Code :

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

SELECT categorie, equipe FROM classement_des_equipes WHERE categorie='cadf' AND equipe <> '[object]' ORDER BY equipe ASC

C'est le [object] qui coince.
Voilà, j'espère que mes explications sont claires et que quelqu'un saura m'aider un peu.
Merci d'avance

[E.Bzz]

L'objet qui coince, c'est la récupération du paramètre "post" et sa prise en compte dans la requête SQL.

Pur PHP, quoi

Je pense que tu trouveras ça dans la plupart des discussion du forum Ajax

A+

[Equinoxe5]

Je recupère bien le post puisque la catégorie est bien incrémentée. C'est equipe1 qui pose problème.

Code :

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

xhr.send("categorie="+choix+"&equipe1="+equipe1);

[Bovino]

Moi, j'ai du mal à voir où tu définis equipe1.

[E.Bzz]

Je recupère bien le post puisque la catégorie est bien incrémentée. C'est equipe1 qui pose problème.

J'avais bien compris, et ce n'est pas de la récupération dont je parlais, mais de l'intégration de cette valeur dans ton SQL ...

Moi, j'ai du mal à voir où tu définis equipe1.

J'ai peur que ça ne marche que grâce à la permissivité d'IE

Il permet(tait) d'accéder à un objet uniquement via son id

Code :

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

id_element.value  = 'toto';

Associé au fait qu'il confond name et id, je crains que "equipe1" fasse bien référence au <select>
Méga coup de bol (et hyper aléatoire) si c'est le cas vu qu'equipe1 est aussi l'id du div parent re-

A+

[Equinoxe5]

Ca y est j'ai trouvé.

Je vous mets la solution détaillée ce soir avec le code. Ca pourra peut-être servir à d'autres personnes

[Equinoxe5]

Voilà donc ce que j'ai fait.

Déjà, E.Bzz avait raison en disant Par contre, tu ne devrais pas donné aux div un id qui correspond aux name des select : en effet IE a du mal à distinguer id et name et ça pourrait poser problème ...
Ca posait problème.

Pour rappel, le but est d'entrer les adversaires d'une rencontre sportive suivant la catégorie des joueurs sans que l'équipe choisie dans la première liste n'apparaisse dans la seconde puisqu'une équipe ne se rencontre pas.

Ensuite voici le code complet

La partie Ajax du module principal

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
<script type='text/javascript'>
        function getXhr(){
        var xhr = null; 
        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 {
  alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
  xhr = false; 
  }
                return xhr;
 }
 
function go(){
var xhr = getXhr();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
   leselect = xhr.responseText;
   document.getElementById('liste1').innerHTML = leselect;
   }
}
 xhr.open("POST","../equipe1.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('categorie');
 choix = sel.options[sel.selectedIndex].value;
 xhr.send("categorie="+choix);
 }
 
function go2(){
var xhr = getXhr();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
 leselect = xhr.responseText;
   document.getElementById('liste2').innerHTML = leselect;
   }
}
 xhr.open("POST","../equipe2.php",true);
 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 sel = document.getElementById('categorie');
 choix = sel.options[sel.selectedIndex].value;
 sel = document.getElementById('equipe1');
 choix2 = sel.options[sel.selectedIndex].value;
 xhr.send("categorie="+choix+"&equipe1="+choix2);
 }
</script>

(La partie en gras me posait problème aussi).

Le select de la liste catégorie

Code :

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

<select name='categorie' id='categorie' onchange='go()'>

Le DIV de la première équipe

Code :

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

1
2
3
4
5
    <div id='liste1' style='display:inline'>
     <select name='liste1'>
     <option selected>Equipe locaux</option>
     </select>
    </div>

Le DIV de la seconde équipe

Code :

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

1
2
3
4
5
   <div id='liste2' style='display:inline'>
     <select name='liste2'>
     <option selected>Equipe visiteurs</option>
     </select>
    </div>

Le fichier php de la première équipe

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
<?php
        header('Content-Type: text/html; charset=ISO-8859-15');          // Pour avoir les lettres accentuees dans le formulaire
        echo "<select name='equipe1' id='equipe1' onchange='go2()'>";
	$categorie=utf8_decode ($_POST['categorie']);
         echo "<option value=\"\"></option>";
         require ("./config/config.inc.php");
         $query = "SELECT categorie, equipe FROM classement_des_equipes WHERE categorie='$categorie' ORDER BY equipe ASC";
         $result = mysql_query($query) or die('Erreur SQL !'.$sql.''.mysql_error());;
         while($row = mysql_fetch_array($result))
         {
         echo"<option value=\"".$row['equipe']."\">".$row['equipe']."</option>";
         $equipe1=$row['equipe'];
         }
 echo "</select>";
?>

Le fichier php de la seconde équipe

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
<?php
        header('Content-Type: text/html; charset=ISO-8859-15');          // Pour avoir les lettres accentuees dans le formulaire
        echo "<select name='equipe2' id='equipe2'>";
	$equipe1=utf8_decode ($_POST['equipe1']);
         echo "<option value=\"\"></option>";
         require ("./config/config.inc.php");
         $query = "SELECT categorie, equipe FROM classement_des_equipes WHERE categorie='".$_POST['categorie']."' AND equipe <> '$equipe1' ORDER BY equipe ASC";
         $result = mysql_query($query) or die('Erreur SQL !'.$sql.''.mysql_error());;
         while($row = mysql_fetch_array($result))
         {
         echo"<option value=\"".$row['equipe']."\">".$row['equipe']."</option>";
         $equipe2=$row['equipe'];
         }
 echo "</select>";
?>

Et ça fonctionne. L'équipe sélectionnée dans la 1ere liste n'apparait pas dans la seconde.
J'ai rajouté aussi un utf8_decode car xhr.send n'aime pas trop les lettres accentuées.

Je vous remercie tous de votre aide et de vos conseils en tout cas

[E.Bzz]

Par contre, pour ne pas reproduire la même erreur

Code :

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

1
2
<div id='div_liste1' style='display:inline'>
     <select name='liste1'>

Pareil pour liste2

A+