[AJAX] Liste de selections liées avec plusieurs paramètres
Bonjour,
Voila j'ai chercher un peu partout un tuto qui répondrais à mon besoin.
Le contexte : un site Ecommerce, avec des fiches produits, qui celle ci permet via deux listes de sélections de choisir pour la première la taille et pour la deuxième la couleur associée. Elles sont liées à savoir le choix de la première détermine l'affichage de la deuxième.
Il y a différente solutions pour réaliser cela, et j'ai choisi l'option php + Ajax.
Le tuto propose un script tout fait qui permet de se faire la main, j'ai donc adapter le code au mien et tout c'est bien passé. Ce tuto permet de passer un argument qui est pour moi l'id de la taille du produit. Mais j'ai besoin de passer un deuxième argument l'id de mon produit.
C'est composé en 3 fichiers, le premier avec la première liste de sélection qui permet donc de choisir la taille, le deuxième en ajax permet de récupérer le fameux id de la taille et de le transmettre au 3eme fichier.
Jusqu'ici tout fonctionne bien mais le 3eme fichier a besoin de l'id du produit pour fonctionner avec mon code et mes requêtes sql. J'ai essayé de le faire moi même, je comprends d'où vient le problème mais j'avoue ne pas être assez bon en javascript / ajax pour faire ça.
Donc voici le premier fichier qui permet de transmettre l'id de la taille et la sélectionne :
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
| <?php
$sql = "SELECT taille.id as idr , taille, id_produit_taille as id_product, id_taille FROM taille, taille_produit WHERE id_produit_taille = '$id_produit' AND taille.id = id_taille";
$connexion = mysql_connect($serveur, $admin, $mdp);
if($connexion != false)
{
$choixbase = mysql_select_db($base, $connexion);
$recherche = mysql_query($sql, $connexion);
$regions = array();
$id = 0;
while($ligne = mysql_fetch_assoc($recherche))
{
$regions[$ligne['idr']] = $ligne['taille'];
}
?>
<br><br>
<select name="region" id="region" onchange="getDepartements(this.value);">
<option value="vide">Choisissez une taille</option>
<?php
foreach($regions as $nr => $nom)
{
?>
<option value="<?php echo($nr); ?>"><?php echo($nom); ?></option>
<?php
}
?>
</select>
<span id="blocDepartements"></span><br />
<?php
}
else
{
?>
<p>La connexion au serveur de base de données a échoué. Aucun élément ne peut être affiché.</p>
<?php
}
?> |
ici l'id de mon produit est déclaré plus haut :
Code:
$id_produit = $_GET['id'];
Puis le deuxième fichier qui est donc en ajax :
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
| var requete = null;
function creerRequete()
{
try
{
requete = new XMLHttpRequest();
}
catch (microsoft)
{
try
{
requete = new ActiveXObject('Msxml2.XMLHTTP');
}
catch(autremicrosoft)
{
try
{
requete = new ActiveXObject('Microsoft.XMLHTTP');
}
catch(echec)
{
requete = null;
}
}
}
if(requete == null)
{
alert('Impossible de créer l\'objet requête,\nVotre navigateur ne semble pas supporter les object XMLHttpRequest.');
}
}
function actualiserDepartements()
{
var listeDept = requete.responseText;
var blocListe = document.getElementById('blocDepartements');
blocListe.innerHTML = listeDept;
}
function getDepartements(idr,id_product)
{
if(idr == 'vide')
{
document.getElementById('blocDepartements').innerHTML = '';
}
else
{
var blocListe = document.getElementById('blocDepartements');
blocListe.innerHTML = "";
creerRequete();
var url = 'departements.php?idr=' + idr + '&id_product=' + id_product;
requete.open('GET', url, true);
requete.onreadystatechange = function()
{
if(requete.readyState == 4)
{
if(requete.status == 200)
{
actualiserDepartements();
}
}
};
requete.send(null);
}
} |
Ici j'ai modifié deux lignes :
Code:
function getDepartements(idr,id_product)
car je veux ici passer l'argument id_product et
Code:
var url = 'departements.php?idr=' + idr + '&id_product=' + id_product;
pour faire un Get dans mon 3eme fichier, je ne pense pas avoir fait d'erreur ici...
Et donc voici le 3eme fichier :
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
| <?php
$idr = isset($_GET['idr']) ? $_GET['idr'] : false;
if(false !== $idr)
{
$sql2 = "SELECT id_couleur, id_couleurs,id_taille_couleur, nom_couleur FROM couleur,couleur_produit WHERE id_taille_couleur = '$idr' AND id_produit_couleur = '$id_product' AND id_couleur = id_couleurs ORDER BY id_couleur";
$connexion = mysql_connect($serveur, $admin, $mdp);
mysql_select_db($base, $connexion);
$rech_dept = mysql_query($sql2, $connexion);
$nd = 0;
$code_dept = array();
$nom_dept = array();
while(false != ($ligne_dept = mysql_fetch_assoc($rech_dept)))
{
$code_dept[] = $ligne_dept['id_couleur'];
$nom_dept[] = $ligne_dept['nom_couleur'];
$nd++;
}
$liste = "";
$liste .= '<select name="departement" id="departement">'."\n";
for($d = 0; $d < $nd; $d++)
{
$liste .= ' <option value="'. $code_dept[$d] .'">'. htmlentities($nom_dept[$d]) .'</option>'."\n";
}
$liste .= '</select>'."\n";
mysql_free_result($rech_dept);
echo($liste);
}
else
{
echo("<p>Une erreur s'est produite. La région sélectionnée comporte une donnée invalide.</p>\n");
}
?> |
Ici si j'ajoute manuellement $id_product = 115; par exemple 115 est ici l'id de ma fiche produit cela marche parfaitement les listes de sélection affiche bien la taille et la ou les couleurs correspondantes. Mais je n'arrive pas a transmettre ce fameux id de ma fiche produit.
Je pense et je me trompe peut être ! mais c'est ici que tout ce joue :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| <select name="region" id="region" onchange="getDepartements(this.value);">
<option value="vide">Choisissez une taille</option>
<?php
foreach($regions as $nr => $nom)
{
?>
<option value="<?php echo($nr); ?>"><?php echo($nom); ?></option>
<?php
}
?>
</select> |
Mais je n'ai jamais fait ça, j'ai chercher un peu partout pour savoir comment transmettre deux values et ensuite les récupérer en ajax.
Merci, si quelqu'un pourrais m'apporter de l'aide:ccool:
