Liste déroulante dynamique

alexandre -
jeremy.s Messages postés 1226 Date d'inscription Statut Membre Dernière intervention - 5 juil. 2013 à 22:38

Bonjour,

Je suis sur un projet et j'ai un souci car j'ai une table avec des champs ( Bon Palette,Nom du Fournisseur,Salon,Catalogue,Référence Article) je precise que j'ai pas id car j'extrais un fichier .csv que je mets dans une table.

J'aimerais avoir une première liste déroulante qui affiche les différents champs et lorsqu'on choisis un champs nous aurions une deuxième liste déroulante qui se génère en fonction d'une requête mysql.

Enfin cela me permettrait d'envoyer les paramètres choisis et donc d'afficher ma table dans un tableau avec pour conditions les 2 paramètres des listes.

VOICI MON CODE:

 <!-- saisonnier.php -->

    <!DOCTYPE html>
    <html lang="fr">

    <head>
       
            <title>exemple</title>
            <!-- definir la feuille de style de mon site -->
            <link rel="stylesheet" href="../skin/style1.css"/>
            <!-- definir l'encodage en utf8 -->
            <meta http-equiv=Content-Type content="text/html; charset=utf-8" />
            <!-- mettre la compatibilité a ie8 par defaut -->
            <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"/>
            <script type="text/javascript">
            <!-- fonction java script servant a la partie admin pour afficher ou cacher mes formulaires

             
           
            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 click du bouton
    */
    function trouver_champs()
    {
    var xhr = getXhr();
        //On défini 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 a la liste
            document.getElementById('champs').innerHTML = leselect;
            }
        };

    // Ici on va voir comment faire du post
    xhr.open("POST","recherchesaisonnier.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 l'auteur
    sel = document.getElementById('champs');
    idchamps = sel.options[sel.selectedIndex].value;
    xhr.send("idchamps="+idchamps);
    }
    //******************************************************************************************************
    //******************************************************************************************************

    function trouver_option()
    {
    var xhr = getXhr();
    // On défini 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 a la liste
                document.getElementById('option1').innerHTML = leselect;
            }
        };

    // Ici on va voir comment faire du post
    xhr.open("POST","option1.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 l'option1
    sel = document.getElementById('option1');
    idoption1 = sel.options[sel.selectedIndex].value; // PROBLEME ICI
    xhr.send("idoption1="+idoption1);
    }
           

        </script>       
    </head>

    <body>
    <fieldset>


    <label > filtre </label><br/>
    <select name="champs" id="champs" onchange='trouver_champs();' >
    <option value="all">all</option>
    <option value="Bon Palette">Bon Palette</option>
    <option value="Nom du Fournisseur">Nom du Fournisseur</option>
    <option value="Salon">Salon</option>
    <option value="Catalogue">Catalogue</option>
    <option value="Référence Article">Référence Article</option>
    </select><br/>

    <label> option </label><br/>
    <select id='option1' onchange='trouver_option();'>
    <option value='-1'>Choisir un autre filtre</option>
    </select><br/>

    </body>
    </fieldset>
    </html>

----------------------------------------------------------------------------------
recherchesaisonnier.php
----------------------------------------------------------------------------------

 <?php
    require_once('../plugin/MaClassBDD.php'); // ceci est un //objet qui me permet de traiter mes requêtes est cela //marche tres bien
    session_start ();
    $db='csv_db';
    $table='table 1';
    $host='*********';
    $login='*****';
    $mp='*****';
    if (isset($_SESSION['pseudo']) && !empty($_SESSION['pseudo'])
    AND isset($_SESSION['pass']) && !empty ($_SESSION['pass'])
    AND isset($_SESSION['magasin']) && !empty ($_SESSION['magasin'])
    AND isset($_SESSION['acces']) && !empty ($_SESSION['acces']))
    {
    	$pseudo = $_SESSION["pseudo"];
    	$magasin=$_SESSION["magasin"];
    	$acces=$_SESSION["acces"];
    	$champs=$_POST["idchamps"];
    	$_SESSION["idchamps"]=$champs;
    	//echo "$champs";

    	if( $champs!="all")
    	{

    		$select2="$champs";
    		if($acces=="all")
    		{

    		$droit="'Nom Magasin'='$magasin'";
    		}
    		else
    		{
    			if($acces=="admin")
    			{
    			$droit="*";
    			}
    			else
    			{
    			$droit="'Nom Magasin'='$magasin' AND 'GT'='$acces'";
    			}
    		}
    	}
    	else
    	{
    		if($acces=="all")
    		{

    		$droit="'Nom Magasin'='$magasin'";
    		}
    		else
    		{
    			if($acces=="admin")
    			{
    			$droit="*";
    			}
    			else
    			{
    			$droit="'Nom Magasin'='$magasin' AND 'GT'='$acces'";
    			}
    		}
    		$select2="*";
    	}
    }




    <?php
    echo "<select name='livre'>";
    if(isset($_POST["idchamps"]) && ($select2!="*") )
    {
    	$bdd=new C_BDD($db,$table,$host,$login,$mp);
    	$requete="SELECT '$champs' FROM '$table' WHERE $droit";

    	$ressource=$bdd->Effectuer_Requete($requete);
    	while($resultat = mysql_fetch_array($ressource))
    	{
    	$res=$resultat["$champs"];
    	echo "<option value='$res'>$res</option>";
    	//echo "champs= $champs <br/>";
    	}
    }
    else
    {
    	if(isset(($select2=="*") )
    	{
    		$bdd=new C_BDD($db,$table,$host,$login,$mp);
    		$requete="SELECT * FROM '$table' WHERE $droit";

    		$ressource=$bdd->Effectuer_Requete($requete);
    		while($resultat = mysql_fetch_array($ressource))
    		{
    		$res=$resultat["$champs"];
    		echo "<option value='$res'>$res</option>";
    		echo "champs= $champs <br/>";
    		}
    	}
    	else
    	{
    	echo 'pas de parametre envoyer';
    	}
    }
    echo "</select>";
    ?>

Désolé pour les fautes d'orthographe ou pour les erreurs de programmation

Merci de m'avoir lu et de m'aider à régler mon problème.

Afficher la suite

A voir également:

Liste déroulante dynamique
Liste déroulante excel - Guide
Liste déroulante en cascade - Guide
Tableau croisé dynamique - Guide
Liste déroulante google sheet - Accueil - Guide bureautique
Liste code ascii - Guide

5 réponses

Réponse 1 / 5

smiley5555 Messages postés 80 Date d'inscription Statut Membre Dernière intervention 22

Je pense qu'il faut du javascript pour faire ça, mais je ne peux pas t'aider car je ne code pas javascript

Réponse 2 / 5

Utilisateur anonyme

Salut !

As-tu essayé de mettre un

alert(idoption1);

après ton // PROBLEME ICI ??

Même si tu postes une connerie, quelqu'un donnera une réponse intéressante et tu apprendras en même temps !

alexandre

Oui j'ai essayer, mais ça ne marche pas

Réponse 3 / 5

jeremy.s Messages postés 1226 Date d'inscription Statut Membre Dernière intervention 79

Salut !

Regarde du coté de jQuery ;-)
Tu pouras simplifié ton code et y voir un plus clair

A priori ton code js pour la partie ajax a l'air juste, le code php aussi.
Donc je te conseils vraiment jquery : https://jquery.com/
Si tu veux je t'aiderai à transformer ton code !

Réponse 4 / 5

alexandre

comment faire pour modifier le code stp ??

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

Posez votre question

Réponse 5 / 5

jeremy.s Messages postés 1226 Date d'inscription Statut Membre Dernière intervention 79

Fais un alert de xhr.responseText pour voir si ton php est bien appelé et renvoie bien qq chose.

Ensuite rajoute quand même un id dans ta bdd, c'est mieux et ca ne change rien à ton import vu que l'id est auto incrémenté il est indépendant du fichier que t'extrais

Comme ca dans le onchange tu envois l'id, tu fais ta requete, tu renvois les options, tu les intègre au select et voilà.

Par contre je comprend pas pourquoi tu as un onchange sur les deux select ?

alexandre

d'accord c'est une erreur les deux Onchanges, après pour le ID ça va pas me changer mon import car j'utilise LORD DATA INFILE

jeremy.s Messages postés 1226 Date d'inscription Statut Membre Dernière intervention 79

Refais voir ton code avec un onchange et une fonction du coup, et avec un alert de responseText aussi

alexandre

va voir ici j'ai le code modifier mais tu ne verra pas l'importation car c une autre fonction php que j'ai faite avant bref de de ID. regarde celui du bas ^^

http://www.siteduzero.com/forum/sujet/liste-deroulante-dynamique-en-php?page=1#message-84473325

jeremy.s Messages postés 1226 Date d'inscription Statut Membre Dernière intervention 79

Le onchange est sur le premier select ;-)

<label > filtre </label><br/>
<select name="champs" id="champs" onchange="trouver_option(this.value);" >
<option value="all">all</option>
<option value="2">Bon Palette</option>
<option value="3">Nom du Fournisseur</option>
<option value="4">Salon</option>
<option value="5">Catalogue</option>
<option value="6">Référence Article</option>
</select><br/>

<label> option </label><br/>
<select id='option1'>
<option value='-1'>Choisir un autre filtre</option>
</select><br/>

function trouver_option(element) {

var xhr = getXhr();

xhr.onreadystatechange = function(xhr) {
if(xhr.readyState === 4 && xhr.status === 200)
{
leselect = xhr.responseText;
document.getElementById('champs').innerHTML = leselect;
}
};

xhr.open("POST","recherchesaisonnier.php",true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
idoption1 = element;
xhr.send("idoption1="+idoption1);
}

alexandre

c'est juste sa???

Discussions similaires

Suppression listes déroulantes

Supprimer liste déroulante Excel

Effacer le contenue d'une cellule avec liste déroulante

Effacer liste déroulante

Supprimer Liste déroulante

Votre réponse

Discussions similaires