Ajax et Listes liees

Résolu
cs_AlexKing Messages postés 5 Date d'inscription mardi 3 juin 2003 Statut Membre Dernière intervention 22 janvier 2008 - 9 janv. 2006 à 09:33
cs_AlexKing Messages postés 5 Date d'inscription mardi 3 juin 2003 Statut Membre Dernière intervention 22 janvier 2008 - 9 janv. 2006 à 14:27
Bonjour,

je cherche a faire quelque chose avec les scripts que j'ai pu trouver sur ce site mais mes connaissances limitees en javascript m'empechent d'avancer.

Je m'explique, j'ai un formulaire avec pleins de listes deroulantes. Ces listes sont alimentees par une fonction qui va chercher les elements dans une table. Par exemple j'ai une table "Matiere" avec comme champs et données:
***************
* id * Matiere *
* 1 * Nubuc *
* 2 * Plastic *
* 3 * Cuir *
***************

Et une table de couleur:
***************
* id * Couleur *
* 1 * Blanc *
* 2 * Bleu *
* 3 * Rouge *
***************

Et la table qui les lie "matiereLcouleur:
*************************
* id_Matiere * id_Couleur *
* 1 * 2 *
* 1 * 3 *
* 2 * 1 *
* 2 * 2 *
*************************

Vous l'aurez compris quand une matiere et selectionnée je voudrais que la liste de couleur qui lui est associee ne contiennent QUE les couleurs de la matiere.

Mon probleme est que j'ai 6 listes de matiere dans mon formulaire et autant de listes de couleur. Et ce n'est pas compatible avec une script trouve ici:
http://phpcs.com/code.aspx?id=25832
ou encore ici:
http://perso.wareteam.com/comment_demander_des_informations_au_serveur_sans_recharger_la_page-.php (c'est le meme).

Pourriez vous m'aider a mettre en place ce truc, a moins que ce ne soit pas faisable.

Par avance merci.

Alex

5 réponses

cs_AlexKing Messages postés 5 Date d'inscription mardi 3 juin 2003 Statut Membre Dernière intervention 22 janvier 2008
9 janv. 2006 à 14:27
Ha oui pk pour la modif.

C'est bon tout est en place. Pour ma requete avec la table de liaison, j'ai utilise ceci:
$req = "SELECT id_Couleur FROM dessusLcouleur WHERE id_DessusMatiere=$champs1";
$res = MYSQL_QUERY($req);
$i = array();
$j=0;
$in = "";
while($r = mysql_fetch_array($res)){
$i[$j] = $r[0];
$j++;
}
$in = implode(",",$i);


$requete = "SELECT Couleur FROM couleur WHERE id IN ($in)";
$resultat=MYSQL_QUERY($requete);
$compteur=MYSQL_NUM_ROWS($resultat);

Ca n'a jamais voulu prendre:
$req = "SELECT id_Couleur FROM matiereLcouleur WHERE id_DessusMatiere=$champs1";
$res = MYSQL_QUERY($req);
$r = mysql_fetch_array($res) // Ces 2 lignes la ne prennent pas
$in = implode(",",$r); // et la!


$requete = "SELECT Couleur FROM couleur WHERE id IN ($in)";
$resultat=MYSQL_QUERY($requete);
$compteur=MYSQL_NUM_ROWS($resultat);

Merci bien en tous cas.

Alex
3
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
9 janv. 2006 à 09:44
Hello,

ce n'est pas difficile, tu appelles tes scripts pour charger les listes sur le onchange de la liste précédente.
Donne nous un début de code...on essayera de t'aider en fonction.
0
cs_frop01 Messages postés 1352 Date d'inscription lundi 27 octobre 2003 Statut Membre Dernière intervention 19 novembre 2008 2
9 janv. 2006 à 10:14
Bonjour,

Ce script est tutorial simple pour expliquer le fonctionnement de deux liste liées.

Pour modifier le script à ce qu'il utilise plusieurs listes déroulantes.
il faut modifier la fonction sendData dans la partie JS comme suit :

<script type="text/javascript">
/**
* Permet d'envoyer des données en GET ou POST en utilisant les XmlHttpRequest
*/
function sendData(param, page, divpart)
{

if(document.all)
{
//Internet Explorer
var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
}//fin if
else
{
//Mozilla
var XhrObj = new XMLHttpRequest();
}//fin else

//définition de l'endroit d'affichage:
var content = document.getElementById(divpart);

XhrObj.open("POST", page);

//Ok pour la page cible
XhrObj.onreadystatechange = function()
{ if (XhrObj.readyState 4 && XhrObj.status 200)
content.innerHTML = XhrObj.responseText ;
}

XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
XhrObj.send(param);

}//fin fonction SendData

</script>

Explication : on a ajouté une variable divpart qu'on va utilisé pour définir la partie à être modifier dynamiquement.

ensuite chaque liste est identifiée par un div. exemple

Liste2


Liste3



Liste4



etc ...

et pour chaque liste on ajoute l'événement OnChange pour appeller la page de chargement depuis le serveur pour modifier dynamiquement la liste suivante exemple :

voici la première liste qui modifie la deuxième liste
<select size="1" name="liste1" OnChange="sendData('id='+this.value,'modifliste2.php','liste2')">
</select>

Voici la deuxième liste qui va modifié la troisième:

<select size="1" name="liste2" OnChange="sendData('id='+this.value,'modifliste3.php','liste3')">

</select>

etc...


et tu n'aura à créer les pages modifliste2.php, modifliste3.php, etc...

Cela dit tu peux optimisé le code à ce qu'il utilise uniquement modifliste.php pour toute les liste en utilisant des tests.

Bonne continuation.
PS: Si votre problème est résolu, prière de bien vouloir clôturer votre message par une réponse acceptée !
http://perso.wareteam.com
http://freelance.wareteam.com
0
cs_AlexKing Messages postés 5 Date d'inscription mardi 3 juin 2003 Statut Membre Dernière intervention 22 janvier 2008
9 janv. 2006 à 10:22
Super, merci ca me permet de bien avancer deja.

est ce que je peux aussi utiliser:
<select size="1" name="liste2" OnChange="sendData('id='+this.value,'modifliste.php?liste=liste2','liste2')">
</select>
?

Bon et bien maintenant je n'ai plus qu'a trouver un truc pour ma structure de table j'ai cette ##### de table liee a prendre en compte.

Si quelqu'un a une idee au passage.

Je previens quand j'ai trouve!

Merci encore

Alex
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cs_frop01 Messages postés 1352 Date d'inscription lundi 27 octobre 2003 Statut Membre Dernière intervention 19 novembre 2008 2
9 janv. 2006 à 10:32
Oui c'est possible mais il faut modifier tout JS+PHP à ce qu'il utilise la fonction $_GET

Mais c'est plus simple de passer les variables par "param" (id=1&liste=liste2)

ex:

OnChange="sendData('id='+this.value+'&liste=liste2','modifliste.php')">

et n'oublies pas le divpart c'est obligatoire.

OnChange="sendData('id='+this.value+'&liste=liste2','modifliste.php', 'liste2'
)">

Bonne continuation.

PS: Si votre problème est résolu, prière de bien vouloir clôturer votre message par une réponse acceptée !
0
Rejoignez-nous