Récupérer id de 2 liste déroulante en ajax

Version imprimable

Bonjour

J'ai créer 2 listes déroulantes par l'intermédiaire d'Ajax. Comme je ne suis pas un pro j'ai pris des bouts de code sur le net j'ai adapté à mon cas

Donc j'ai une liste saison. Quand on choisit une saison une liste de Matchs se remplit donc en fonction de la saison. Et après je choisis le match pour savoir qui a assisté à ce match.

Et donc dans une autre page je voudrais récupérer l'id de la saison et l'id du match pour traitement

J'ai donc une page test.php

Code:

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
104
105
106
107
<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 { // XMLHttpRequest non supporté par le navigateur 
                   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
                   xhr = false; 
                } 
                                return xhr;
            }
 
            /**
            * Méthode qui sera appelée sur le changement de la liste saisons
            */
            function go(){
                var xhr = getXhr();
                // On définit 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 à la liste
                        document.getElementById('Match').innerHTML = leselect;
                    }
                }
 
                // Ici on va voir comment faire du post
                xhr.open("POST","match.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 la saison
                sel = document.getElementById('lst_saisons');
                saisonId = sel.options[sel.selectedIndex].value;
                xhr.send("saisonId="+saisonId);
            }
        </script>
 
</head>
<?php  
connexion à la base
?>
 
<body>
 
	<p>
<table class="tb-admin">
	<tr>
		<td class="td-admin" align="center" colspan="3"><b><font color="#cc0000">En phase de test</font></b></td>
	</tr>
 
	<tr>
		<form name="reservationsaison" method="post" action="liste_reservations_saisons.php">
		<td class="td-admin" align="center">
			<label>Saisons</label>
			<?php
                        $sql = "SELECT COUNT(saisonId) as tSaison 
                                        FROM ot_saisons ";
                        $req=$db->prepare($sql);
                        $req->execute();
                        $r=$req->fetch();
                        $tSaison=$r['tSaison'];
                        
                        $sql1 = "SELECT saisonId, saisonLibelle 
                                        FROM ot_saisons 
                                        WHERE saisonId < '$tSaison' 
                                        ORDER BY saisonId DESC";
                        $req1 = $db->prepare($sql1);
                        $req1->execute();
                        ?>
		<select required="true" name="lst_saisons" id="lst_saisons" onchange='go()'>
        <option value='0'>-- Choisir la saison --</option> 
			<?php
                        while($r1 = $req1->fetch()){ 
                                
                ?>
        <option value="<?php echo $r1['saisonId']; ?>"> <?php echo $r1['saisonLibelle'] ?></option>\n;
        <?php
        }
                ?>
 
		</select>
		</td>
		<td>
			<label>Matchs</label>
                <div id='Match' style='display:inline'>
                <select name='Match'>
                    <option value='-1'></option>
 
                </select>
                </div>
			</td>
			<td>
			<input class="input-admin" type="submit" name="Enregistrer" id="Enregistrer" value="R&eacute;servations Par Saison" />
			</td>
			</form>
		</tr>
</table

Et j'ai donc fait une page pour faire remonter les matchs par rapport à la saison
Voici ma page match.php

Code:

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
connexion à la base
 
echo "<select name='Match'>";
 
	if(isset($_POST["saisonId"])){
		$sql = "SELECT * FROM ot_matchs 
			WHERE matchSaisonId = ".$_POST["saisonId"]." 
			ORDER BY matchDate ASC";
			$req = $db->prepare($sql);
			$req->bindValue(':matchSaisonId', $_POST["saisonId"],PDO::PARAM_INT);
			$req->execute();
 
		while($r = $req->fetch()){ 
/* pour convertir la date yyyy-mm-dd en dd/mm/yyyy */
 
			$matchId=$r['matchId'];
 
			$date = $r['matchDate'];
			$matchCompetitionId = $r['matchCompetitionId'];
 
			$sql1 = "SELECT competitionId,competitionLibelleLong FROM ot_competitions WHERE competitionId = '$matchCompetitionId'";
			$req1 = $db->prepare($sql1);
			$req1->bindValue(':competitionId', $matchCompetitionId,PDO::PARAM_INT);
			$req1->execute();
			$r1 = $req1->fetch();
			$NomCompetition = $r1['competitionLibelleLong'];
 
			$tabDate = explode('-' , $date);
			$date_conv  = $tabDate[2].'/'.$tabDate[1].'/'.$tabDate[0];
 
			 echo "<option value='".$r["matchId"]."'>".$r["matchLibelle"]." $NomCompetition $date_conv</option>";
		}
 
	}
 
echo "</select>";

Mais là je bloque pour passer mes 2 id (saison et match) à ma page de traitement
J'y suis depuis 2 jour et je n'ai plus de cheveux : je pense que c'est dans ma fonction go (passage des arguments) que je m***e (enfin ce n'est l'avis que d'un newbizz

Si quelqu'un a une idée ou une piste je suis preneur

Cordialement

19/07/2023, 21h41
mathieu

votre souci est coté serveur dans le code php ou coté client en javascript ?

pour suivre les requetes http, vous pouvez utiliser l'onglet "Réseau" de la console de développement de votre navigateur.
par exemple avec Firefox, faites Ctrl + Maj + E
https://developer.mozilla.org/fr/doc...ur_r%C3%A9seau

récupération 2 id ajax

Bonjour

Donc j'ai repris tout à zéro et en prenant un exemple sur un site j'ai résolu une partie de mon problème

J'ai donc crée un objet XmlHTTPRequest

Code:

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
/**
 * Lister les matchs d'une saison avec un objet
 * XMLHTTPRequest.
 */
/* Création de la variable globale qui contiendra l'objet XHR */
var requete = null;
/**
 * Fonction privée qui va créer un objet XHR.
 * Cette fonction initialisera la valeur dans la variable globale définie
 * ci-dessus.
 */
function creerRequete()
{
    try
    {
        /* On tente de créer un objet XmlHTTPRequest */
        requete = new XMLHttpRequest();
    }
    catch (microsoft)
    {
        /* Microsoft utilisant une autre technique, on essays de créer un objet ActiveX */
        try
        {
            requete = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch(autremicrosoft)
        {
            /* La première méthode a échoué, on en teste une seconde */
            try
            {
                requete = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch(echec)
            {
                /* À ce stade, aucune méthode ne fonctionne... mettez donc votre navigateur à jour ;) */
                requete = null;
            }
        }
    }
    if(requete == null)
    {
        alert('Impossible de créer l\'objet requête,\nVotre navigateur ne semble pas supporter les object XMLHttpRequest.');
    }
}
 
/**
 * Fonction privée qui va mettre à jour l'affichage de la page.
 */
function actualiserMatchs()
{
    var listeMatch = requete.responseText;
    var blocListe = document.getElementById('blocMatchs');
    blocListe.innerHTML = listeMatch;
}
 
/**
 * Fonction publique appelée par la page affichée.
 * Cette fonction va initialiser la création de l'objet XHR puis appeler
 * le code serveur afin de récupérer les données à modifier dans la page.
 */
function getMatchs(idr)
{
    /* Si il n'y a pas d'identifiant de saison, on fait disparaître la seconde liste au cas où elle serait affichée */
    if(idr == 'vide')
    {
        document.getElementById('blocMatchs').innerHTML = '';
    }
    else
    {
        /* À cet endroit précis, on peut faire apparaître un message d'attente */
        var blocListe = document.getElementById('blocMatchs');
        blocListe.innerHTML = "Traitement en cours, veuillez patienter...";
        /* On crée l'objet XHR */
        creerRequete();
        /* Définition du fichier de traitement */
       var url = 'match.php?idr='+ idr;
        /* Envoi de la requête à la page de traitement */
        requete.open('GET', url, true);
        /* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */
        requete.onreadystatechange = function()
        {
            /* Lorsque l'état est à 4 */
            if(requete.readyState == 4)
            {
                /* Si on a un statut à 200 */
                if(requete.status == 200)
                {
                    /* Mise à jour de l'affichage, on appelle la fonction apropriée */
                    actualiserMatchs();
                }
            }
        };
        requete.send(null);
    }
}

Ensuite j'ai donc crée ma page match.php qui "montera" les matchs par rapport à la saison choisi

Code:

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
<?php
 
// connexion à ma base ok
 
 
                
        /* On récupère l'identifiant de la saison choisie. */
$idr = isset($_GET['idr']) ? $_GET['idr'] : false;      
                
if(false !== $idr)
{
 
/* Cération de la requête pour avoir les matchs de cette saison */
    $sql2 = "SELECT matchId,matchLibelle,matchSaisonId  
             FROM ot_matchs 
             WHERE matchSaisonId = ". $idr ." 
             ORDER BY matchId ";        
 
        $rech_match = $db->prepare($sql2);
        $rech_match->execute();
        
        
         /* Un petit compteur pour les matchs */
    $nd = 0;
        
        /* On crée deux tableaux pour les id et les libellés des matchs */
    $code_match = array();
    $nom_match = array();
        
         /* On va mettre les numéros et noms des départements dans les deux tableaux */
    while($ligne_match = $rech_match->fetch(PDO::FETCH_ASSOC))
    {
        $code_match[] = $ligne_match['matchId'];
        $nom_match[]  = $ligne_match['matchLibelle'];
        $nd++;
                
        }
 
                 /* Maintenant on peut construire la liste déroulante */
    $liste = "";
    $liste .= '<select name="match" id="match">'."\n";
 
    for($d = 0; $d < $nd; $d++){
                 $liste .= '  <option value="'. $code_match[$d] .'">'. htmlentities($nom_match[$d]) .' ('. $code_match[$d] .')</option>'."\n";
                $matchId=$code_match[$d];
                echo "matchId ".$matchId."<br>"; // a l'affichage j'ai bien mes match avec leur id en fonction de la saison
                }
                $liste .= '</select>'."\n";
                
                /* Affichage de la liste déroulante */
    echo($liste);
        
}
                        
                /* Sinon on retourne un message d'erreur */
/*else
{
    echo("<p>Une erreur s'est produite. La saison sélectionnée comporte une donnée invalide.</p>\n");
}
*/                      
?>

et en fin j'ai ma page principale ou je sélectionne ma saison

Code:

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
<?php
                echo("<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\n");
 
// connexion à ma base ok	
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" xml:lang="fr" />
<link rel="stylesheet" type="text/css" href="https://www.omtoujours.fr/omtoujours.css" />
<title>Les Reservations bis</title>
<script type="text/javascript" src="match_xhr.js" charset="utf-8"></script>
 
<?php
 
                /* Requête SQL de récupération des données de la première liste */
$sql = "SELECT saisonId AS idr, saisonLibelle 
       FROM ot_saisons 
       ORDER BY saisonId DESC ;";
                
                $recherche = $db->prepare($sql);
                $recherche->execute();
        
                 /* Création du tableau PHP des valeurs récupérées */
    $saisons = array();
                 /* Index du match par tableau des saison */
    $id = 0;
    while($ligne = $recherche->fetch(PDO::FETCH_ASSOC))
    {
        $saisons[$ligne['idr']] = $ligne['saisonLibelle'];
    }
                
                
?>
</head>	
	<p>
<body>
 
 
<table class="tb-admin">
	<tr>
<!--	<form action="traitement.php" method="post" id="chgmatch"> -->
	<form action="liste_reservations_saisons.php" method="post" id="chgmatch">
		<input type="hidden" name="match" value="<?php echo $code_match[$d] ; ?>">
<!--  <fieldset style="border: 3px double #333399"> -->
  		<!-- <legend>Sélectionnez une saison</legend> -->
		<td class="td-admin" align="center">
    <select name="saison" id="saison" onchange="getMatchs(this.value);">
      <option value="vide">- - - Choisissez une saison - - -</option>
		<?php
    /* Construction de la première liste : on se sert du tableau PHP */
    foreach($saisons as $nr => $nom)
    {
        ?>
    <option value="<?php echo($nr); ?>"><?php echo($nom); ?></option>
<?php
    }
    ?>
    </select>
		</td>
		<td class="td-admin" align="center">
 
		<!-- on met un bloc avec un id ou va s'insérer le code de
         la seconde liste déroulante -->
			<spam id="blocMatchs"></spam></br>
		</td>
		<td class="td-admin" align="center">	
		  <input type="submit" name="ok" id="ok" value="Envoyer" />
		</td>
<!-- </fieldset> -->
</form>
	</tr>
</table>
</body>
</html>

Et donc j'ai une page traitement ou je veux récupérer l'id de la saison sélectionnée ainsi que l'id du match de la saison choisie pour faire une requête par rapport à l'id du match

Je récupéré bien l'id de la saison mais impossible de récupérer l'id du match

Si vous avez des pistes ou autres je suis preneur

Cordialement