Publicité
+ Répondre à la discussion
Affichage des résultats 1 à 9 sur 9
  1. #1
    Invité de passage
    Homme Profil pro Nicolas
    Développeur informatique
    Inscrit en
    décembre 2012
    Messages
    26
    Détails du profil
    Informations personnelles :
    Nom : Homme Nicolas
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : décembre 2012
    Messages : 26
    Points : 0
    Points
    0

    Par défaut Afficher un tableau dynamiquement selon une liste déroulante

    Bonjour,
    Je ne sais pas si je suis dans le bon forum car j'ai besoin de PHP, de HTML et (je pense) de AJAX.

    Alors, je veux afficher un tableau dynamiquement, c'est à dire selon le choix fait dans une liste déroulante.
    Pour cela, j'ai ça comme liste déroulante :
    Code HTML :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    <p class="p0">
           Afficher depuis :
           <form>
                <select name="afficher">
                      <option selected value ="0">Toujours</option>
                      <option value="1">1 an</option>
                      <option value="2">2 ans</option>
                      <option value="3">3 ans</option>
                      <option value="4">4 ans</option>
                      <option value="5">5 ans</option>
                 </select>
             </form>
    </p>
    Ensuite, le tableau correspondant au choix doit s'afficher directement à coté sans avoir besoin de cliquer sur un bouton Valider ni de changer de page.
    J'aimerais également que le tableau s'affiche par défaut pour "Toujours", puis qu'il change lorsque qu'il choisi l'année.

    J'aimerais savoir comment faire pour que le tableau varie selon le choix fait par l'utilisateur, je pense qu'il faut passer par ajax mais si y'a un autre moyen, je prends !

    Merci

  2. #2
    Candidat au titre de Membre du Club Avatar de guillaume40
    Homme Profil pro Guillaume
    Inscrit en
    janvier 2007
    Messages
    97
    Détails du profil
    Informations personnelles :
    Nom : Homme Guillaume
    Localisation : France

    Informations forums :
    Inscription : janvier 2007
    Messages : 97
    Points : 11
    Points
    11

    Par défaut

    Bonjour,
    Tu peux utiliser jQuery pour faire ça assez simplement.

    Tu ajoute après ton formulaire un
    Code :
    <div id="resultat"></div>
    et dedans tu y met le code par défaut, c'est à dire pour la valeur Toujours.

    Ensuite avec jQuery tu utilises
    Code :
    $("#tonChamp").onChange();
    pour détecter un changement de valeur. Et dans le corps de onChange() tu met ta requette Ajax qui va récupérer et remplacer le contenu dans ton div #resultat.

  3. #3
    Modérateur
    Avatar de sabotage
    Homme Profil pro Vincent
    Inscrit en
    juillet 2005
    Messages
    21 431
    Détails du profil
    Informations personnelles :
    Nom : Homme Vincent

    Informations forums :
    Inscription : juillet 2005
    Messages : 21 431
    Points : 31 229
    Points
    31 229

    Par défaut

    Ici un exemple pour des listes liées :
    http://siddh.developpez.com/articles/ajax/

    Ce que tu veux faire suit le meme principe sauf que ton resultat au lieu d'alimenter un autre liste, va alimenter un tableau.

    Pour le problème de valeur par défaut, tu ne l'auras plus puisque tu ne recharges plus la page.

  4. #4
    Responsable Développement Web

    Avatar de Bovino
    Homme Profil pro Didier Mouronval
    Développeur Web
    Inscrit en
    juin 2008
    Messages
    22 413
    Détails du profil
    Informations personnelles :
    Nom : Homme Didier Mouronval
    Âge : 44
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juin 2008
    Messages : 22 413
    Points : 87 158
    Points
    87 158
    Billets dans le blog
    4

    Par défaut

    Citation Envoyé par guillaume40
    Tu peux utiliser jQuery pour faire ça assez simplement.
    Pourquoi toujours vouloir utiliser jQuery même quand c'est inutile ?
    Citation Envoyé par guillaume40
    Ensuite avec jQuery tu utilises
    Code :
    $("#tonChamp").onChange();
    pour détecter un changement de valeur.
    onChange() est devenu une méthode jQuery ?
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  5. #5
    Candidat au titre de Membre du Club Avatar de guillaume40
    Homme Profil pro Guillaume
    Inscrit en
    janvier 2007
    Messages
    97
    Détails du profil
    Informations personnelles :
    Nom : Homme Guillaume
    Localisation : France

    Informations forums :
    Inscription : janvier 2007
    Messages : 97
    Points : 11
    Points
    11

    Par défaut

    Oups désolé le "on" est en trop.

    Tu trouve que c'est inutile ? Moi je trouve que ça réduis le code utilisé.
    Et puis si par la suite il veut rajouter des effets lors du changement ça sera déjà en place.

  6. #6
    Responsable Développement Web

    Avatar de Bovino
    Homme Profil pro Didier Mouronval
    Développeur Web
    Inscrit en
    juin 2008
    Messages
    22 413
    Détails du profil
    Informations personnelles :
    Nom : Homme Didier Mouronval
    Âge : 44
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juin 2008
    Messages : 22 413
    Points : 87 158
    Points
    87 158
    Billets dans le blog
    4

    Par défaut

    Je trouve inutile d'utiliser jQuery dès qu'on veut faire quelque chose sur son site.
    Pour des listes liées, contrairement à ce que tu crois, ça augmente considérablement le nombre de lignes de code car il faut prendre en compte l'importation de jQuery pour un truc qui se fait en 100 LOC maxi en gérant tous les cas dont tu as besoin et non tous ceux dont d'autres pourraient avoir besoin mais pas toi.

    Ensuite, bien entendu, si tu as de nombreux besoins différents, jQuery (ou autre) reste une option, mais pas juste pour un truc que t'as la flemme de coder.
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  7. #7
    Invité de passage
    Homme Profil pro Nicolas
    Développeur informatique
    Inscrit en
    décembre 2012
    Messages
    26
    Détails du profil
    Informations personnelles :
    Nom : Homme Nicolas
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : décembre 2012
    Messages : 26
    Points : 0
    Points
    0

    Par défaut

    Ok merci pour votre aide, je vais essayer ça demain, je vous tient au courant.

  8. #8
    Invité de passage
    Homme Profil pro Nicolas
    Développeur informatique
    Inscrit en
    décembre 2012
    Messages
    26
    Détails du profil
    Informations personnelles :
    Nom : Homme Nicolas
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : décembre 2012
    Messages : 26
    Points : 0
    Points
    0

    Par défaut

    Alors, j'ai fait un truc du genre :
    Code HTML :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    <form>
        <label>Afficher depuis :</label>
        <select name='annee' id='annee' onchange='go()'>
            <option value='-1'>Toujours</option>
            <option value='12'>1 an</option>
            <option value='24'>2 ans</option>
            <option value='36'>3 ans</option>
        </select>
        <div id='resultat' style='display:inline'>
            <p class="p1">
                Nom de la société: <?php echo $nomSocieteGlobal; ?> <br/>
                Depuis toujours<br/>
                Note moyenne de la société: <b><?php echo $noteGlobal; ?></b> <em>(<?php echo $compteur; ?> notes)</em>
            </p>
        </div>
    </form>

    Ma fonction go() :
    Code javascript :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
                function go(){
                    var xhr = getXhr();
                    xhr.onreadystatechange = function(){
                        if(xhr.readyState == 4 && xhr.status == 200){
                            leselect = xhr.responseText;
                            document.getElementById('resultat').innerHTML = leselect;
                        }
                    }
     
                    xhr.open("POST","tableau.php",true);
                    xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                    sel = document.getElementById('annee');
                    idsociete = sel.options[sel.selectedIndex].value;
                    xhr.send("idSociete="+idSociete);
                }

    Et dans mon tableau.php j'ai :
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
     
    <?php
    $res = $_POST["idSociete"];
    $query1 = 'SELECT avg(note) as noteMoyenne,nomSociete, count(nomSociete) as compteur, avg(conseil) as conseilMoyenne 
        FROM benchmarking_societes_notes 
        WHERE nomSociete= "' . mysql_escape_string($_POST['nomSociete']) . '"
        AND STR_TO_DATE(dateNotation, \'%Y-%m-%d\') 
        BETWEEN STR_TO_DATE(DATE_FORMAT(DATE_SUB(CURRENT_DATE, INTERVAL ' . $res . ' MONTH), \'%Y-%m-%d\'), \'%Y-%m-%d\') 
        AND STR_TO_DATE(DATE_FORMAT(CURRENT_DATE, \'%Y-%m-%d\'), \'%Y-%m-%d\')';
    $result1 = mysql_query($query1) or die('Erreur SQL !<br />' . $query1 . '<br />' . mysql_error());
     
    $row1 = mysql_fetch_array($result1);
    $nomSocieteGlobal1 = $row1['nomSociete'];
    $noteGlobal1 = number_format($row1['noteMoyenne'], 1);
    $compteur1 = number_format($row1['compteur'], 0);
    $conseilMoyenne1 = number_format($row1['conseilMoyenne'], 2);
    ?>
            <p class="p1">
                Nom de la société: <?php echo $nomSocieteGlobal; ?> <br/>
                Depuis toujours<br/>
                Note moyenne de la société: <b><?php echo $noteGlobal; ?></b> <em>(<?php echo $compteur; ?> notes)</em>
            </p>

    Pour m'expliquer, je voudrais afficher le résultat selon l'année choisie : 12 mois pour 1 an d'où la value="12", ou pour 2 ans d'où value="24" ...
    Lorsque je clique sur 1 an j'ai aucune valeur qui apparait. Et je vois aucun message d'erreur ni rien ... Je vois pas comment faire

  9. #9
    Invité de passage
    Homme Profil pro Nicolas
    Développeur informatique
    Inscrit en
    décembre 2012
    Messages
    26
    Détails du profil
    Informations personnelles :
    Nom : Homme Nicolas
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : décembre 2012
    Messages : 26
    Points : 0
    Points
    0

    Par défaut

    C'est bon j'ai réussi, ça bloquait car le nom de la société n'était pas renvoyé sur la 2e page.

+ Répondre à la discussion
Cette discussion est résolue.

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •