liste lié et affichage dynamique

[baddevil]

bonjour a vous tous

je ne sais pas trop si je post au bon endroit car je ne sais si mon soucis est ajax ou php

cependant j ai essayer de crée une liste lier pour un catalogue de piece informatique avec l aide de mes cours car je debute

j ai reussi a crée mon select1 qui affiche dynamique les resultat trouver en dessous et en meme temps met a jours mon select2 avec les marque associer

un exemple http://www.sauvetage-informatique.eu/cat/bis/catiframe

cependant je me retrouvre bloquer pour afficher le trie des marque par mon select2

je sais pas si c est via mon ajax ou mon fichier php qu il manque quelque chose

je vous met mon code ajax qui gere lie mes select

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
 
<script type="text/javascript">
 
 
   //FONCTION AJAX  
 
      function MAJ_marque(Nsouscategorie)
{
    //declaration d'une variable
   var xmlhttp;
 
    //test si un code postale a été choisi
       if (Nsouscategorie.length==0)
    {
		document.getElementById("liste_marques").innerHTML="";
		return;
   }
   // test le type de navigateur pour créer l'objet adapté
  if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 
  // appel et exécution d'une fonction permettant la mise a jour dynamique
  xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
		//remplisage de la zone dynamique marque avec les resultats trouvés en base de données
		document.getElementById("liste_marques").innerHTML=xmlhttp.responseText;
    }
  }
 
 
  xmlhttp.open("GET","principal.php?num="+Nsouscategorie,true);
   xmlhttp.send();
 
 
  } 
 
 
 
  </script>

ensuite mon code 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
 
 
 if(isset($_GET['num']))
 
       {
 
 
 
       // si on reçois un parametre num c'est que on veux mettre a jour la liste des marques
 
       //sélection des marques qui utilisent la categorie reçu en parametre num
 
          $requete = "SELECT DISTINCT Nmarque FROM Nproduct
                   WHERE 	Nsouscategorie ='".$_GET['num']."'" ;
 
 
 
         // execution de la requete et recuperation les resultats dans une variable
 
         $resultats = mysql_query($requete) ;
 
         //construire la chaine de marques a afficher
 
 
         //commencement de la liste déroulante des marques
 
        $res = "&nbsp;<select name=\"marque\" onchange=\"submit()\">";
 
        $res=$res."<option value=>choisissez une marque</option>";
 
         while($tempo = mysql_fetch_assoc($resultats) )
              {
 
                //répétition des marques trouvées
    			       $res = $res ."<option value=".$tempo['N_ID'].">".$tempo['Nmarque']."</option>";
 
              }
 
         //fin de la liste déroulante
        $res = $res ."</select>";
 
 
	     	echo $res;  
 
 
 
 
	 }   
 
 
        	 if(isset($_POST['CATEGORIE']))
 
        	 {
 
 
                                    //création un nouvel objet tbs
                                    $tbs = new clsTinyButStrong;
 
                                    //modèle html dynamique à utiliser
                                    $tbs -> LoadTemplate("cat.html"); 
 
                                    //création de la requete
                                   $requete = "SELECT* ,round((Nnet_ttc * 1.396),2) as net FROM Nproduct
                                    where Nsouscategorie='".$_POST['CATEGORIE']."'";
 
                             //execute la requete,recupere les resultats et fusionne avec le modele html
                                    $tbs -> MergeBlock('blk',$connexion,$requete);
 
                                    //affiche le fichier html
                                    $tbs -> Show(); 
 
               }
 
          if(isset($_POST['marque']))
        	 {
 
 
                                    //création un nouvel objet tbs
                                    $tbs = new clsTinyButStrong;
 
                                    //modèle html dynamique à utiliser
                                    $tbs -> LoadTemplate("cat.html");
 
                                    $marque= $_POST['marque'];
 
                                    //création de la requete
                                    $requete = "SELECT* ,round((Nnet_ttc * 1.396),2) as net FROM Nproduct
                                    where Nmarque='".$_POST['marque']."'";
 
                                      echo ($marque);
 
 
                             //execute la requete,recupere les resultats et fusionne avec le modele html
                                    $tbs -> MergeBlock('blk',$connexion,$requete);
 
                                    //affiche le fichier html
                                    $tbs -> Show();
 
 
          }

je souhaiterai pouvoir trier par marque ce que j affiche au select1


merci d avance a ceux qui pouront m aider

[Fluid-Val]

Bonjour,

As-tu une erreur qui apparaît sur ta page ?

Pour tester ton code PHP, accède directement à ta page principal.php?num=1 pour voir les erreurs.

Pour tester le javascript, ajoute des alert() ou console.debug() à des lignes stratégiques de tes fonctions pour situer le problème.

Quoiqu'il en soit, je peux déjà te conseiller de sécuriser ton appel SQL avec la fonction mysql_real_escape_string

Code :

1
2
$requete = "SELECT DISTINCT Nmarque FROM Nproduct
                   WHERE 	Nsouscategorie ='".mysql_real_escape_string($_GET['num'])."'" ;

[baddevil]

bonsoir et merci de ta reponse

alors j ai pas d erreur sur ma page

j ai tester le principal.php?num=1

ca m affiche mon 2 eme select et c est tout avec la seul option par defaut "choisissez votre marque

j ai rajouté le mysql_real_escape_string mais avec ca j ai plus d affichage dynamique dans ma frame

et pour java ben je sait pas trop ou mettre les alert

cependant tout fonctionne actuellement sauf pour trie si tu as essayé mon lien tu a pu voir que mon deuxieme select affiche bien les marque associer a mon select1

c est pour afficher lors de la selection par marque que je sais pas comment faire

edit: cest pas 1 que je doit mettre
j ai essayé ceci principal.php?num=Tapis souris

et ca me retourne bien mes marques associer sans erreur

[Fluid-Val]

En fait, tu as besoin d'appeler la fonction lorsqu'on change la valeur de select1, c'est ça ?

Si c'est le cas, faudra voir du coté de l'évènement onchange.

[baddevil]

dans mon ajax j ai qu une seule fonction qui sert a mettre a jour mon select2

mais maintenant je sais pas comment faire pour afficher dynamiquement quand je clik sur une des marques dans mon select2

il me manque quelque chose je pense peut etre une autre fonction lier a mon php

mon premier select etant dans mon formulaire du fichier html mais mon 2 eme select lui est dans mon fichier php par un echo

[Fluid-Val]

Mon javascript (sans jquery) est un peu rouillé mais ça devrait donner :

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
 
<select id="souscategorie">
...
</select>
<script>
document.getElementById("souscategorie").onchange = function()
{
var Nsouscategorie = document.getElementById("souscategorie").selectedValue;
MAJ_marque(Nsouscategorie);
};
function MAJ_marque(Nsouscategorie)
{
    //declaration d'une variable
   var xmlhttp;
 
    //test si un code postale a été choisi
       if (Nsouscategorie.length==0)
    {
		document.getElementById("liste_marques").innerHTML="";
		return;
   }
   // test le type de navigateur pour créer l'objet adapté
  if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 
  // appel et exécution d'une fonction permettant la mise a jour dynamique
  xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
		//remplisage de la zone dynamique marque avec les resultats trouvés en base de données
		document.getElementById("liste_marques").innerHTML=xmlhttp.responseText;
    }
  }
 
 
  xmlhttp.open("GET","principal.php?num="+Nsouscategorie,true);
   xmlhttp.send();
 
 
  }

[baddevil]

...
<select id="souscategorie">
...
</select>
<script>
document.getElementById("souscategorie").onchange = function()
{
var Nsouscategorie = document.getElementById("souscategorie").selectedValue;
MAJ_marque(Nsouscategorie);
};

tu peux m expliquez un peu a quoi sert cette partie?

je m excuse etant novice car la j ai copier ca mais le 2 eme select ne fonctionne plus avec ca en plus

[baddevil]

ah si desoler il fonctionne mais je voudrais quand meme savoir a quoi sert cette partie la

[Fluid-Val]

Navré, je n'ai pas commenté mon code.

J'appelle l'évènement onchange à ton select pour appeler une fonction au changement d'option.
Dans cette fonction, on récupère la valeur de l'option sélectionnée et on appelle MAJ_categorie.

[baddevil]

ok donc si j ai bien compris je recupere la valeur du select1 et me la garde dans var Nsoucategorie c est ca?

alors maintenant je doit recuperer cette valeur pour faire le trie avec mon onchange du select 2 ?

[Fluid-Val]

Le select 2 n'a pas besoin de onchange :/

Pour résumer, le onchange de select1 va appeler ta fonction MAJ_categorie avec la valeur de l'option sélectionnée de select 1 !

[baddevil]

ok mais comment je fais pour que quand je clik sur une des marques du select2 que cela m affiche mes resultats?

[Fluid-Val]

Ah, je comprends mieux ce que tu souhaites faire...

Pour select 2, oui, tu dois ajouter l'évènement onchange donc :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
<select id="souscategorie"> ... </select>
<select id="marques"> ... </select>
<script>
// select 1
document.getElementById("souscategorie").onchange = function() { var Nsouscategorie = document.getElementById("souscategorie").selectedValue; MAJ_marque(Nsouscategorie); };

// select 2
document.getElementById("marques").onchange = function() {
// Récupérer l'id de la marque
var marque = document.getElementById("marques").selectedValue;
// Afficher le résultat
MAJ_resultat(marque); };

[baddevil]

le onchange je le rajoute bien aussi a mon fichier php ?

doit me manqué quelque chose sur mon php car j ai pas de difference

[Fluid-Val]

Ton php semble correcte. Il faut simplement créer une function javascript qui va appeler en AJAX le fichier principal.php. Toutefois, il ne faudra pas oublier de déclarer ta requête AJAX avec la méthode POST. Mais si tu veux rester en GET, il faudra changer deux petites lignes dans ton 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
 
if(isset($_GET['marque']))
        	 {
 
 
                                    //création un nouvel objet tbs
                                    $tbs = new clsTinyButStrong;
 
                                    //modèle html dynamique à utiliser
                                    $tbs -> LoadTemplate("cat.html");
 
                                    $marque= $_POST['marque'];
 
                                    //création de la requete
                                    $requete = "SELECT* ,round((Nnet_ttc * 1.396),2) as net FROM Nproduct
                                    where Nmarque='".$_GET['marque']."'";
 
                                      echo ($marque);
 
 
                             //execute la requete,recupere les resultats et fusionne avec le modele html
                                    $tbs -> MergeBlock('blk',$connexion,$requete);
 
                                    //affiche le fichier html
                                    $tbs -> Show();
 
 
          }

[baddevil]

ok donc me manque bien une fonction

java et moi ca fait deux mon code vient de mes fichier de cours mais suis incapable de crée une fonction

[baddevil]

est ce que la fonction est du meme genre que MAJ_marque ? j essai d en faire une mais c est pas gagné

[baddevil]

bonjour

j ai toujours pas reussi la fonction, cependant mon code php n etais pas au point pour le trie par marque alors je l ai modifier et testé en appelant directement via l url

comme ceci principal.php?marque=MCL SAMAR&CATEGORIE=Tapis souris

comme ca cela fonctionne

maintenant comment je fais que cela s affiche en cliquant sur la marque

[baddevil]

je n y arrive toujours pas y a vraiment personne qui pourai m aider??