单击按钮时显示的下拉列表,每个表行上都有相同的按钮

时间:2018-01-06 10:07:33

标签: jquery html

我正在构建一个图书管理页面,我在每个表格行上都有相同的按钮。我设法在jquery的下拉列表中更改它,但这仅适用于第一行的按钮。我不能让它适用于其他行。我可以帮忙吗

<body>
    <?php
    /*
     * To change this license header, choose License Headers in Project Properties.
     * To change this template file, choose Tools | Templates
     * and open the template in the editor.
     */

    try {
        $bdd = new PDO('mysql:host=localhost;dbname=bibliotheque;charset=utf8', 'root', '');
    } catch (Exception $e) {
        die('Erreur de connexion ' . $e->getMessage());
    }
    {
        echo'connection ok';
   }
//On récupère tout le contenu de la table livres
    $reponse = $bdd->query("SELECT * FROM `livres`");
    ?>
    <!--Creation d'une table avec un en-tete en html-->
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Titre du livre</th>
                <th>Prénom auteur</th>
                <th>Nom  auteur :</th>
            </tr>
        </thead>
        <?php
//On cree une requête qui va rechercher chaque entree de la table Livres et on la place dans une colonne du tableau
        while ($donnees = $reponse->fetch()) {
            ?>

            <tbody>
                <tr>
                    <td><?php echo $donnees['id_livre']; ?></td>
                    <td><?php echo $donnees['titre']; ?></td>
                    <td><?php echo $donnees['prenom_auteur']; ?></td>
                    <td><?php echo $donnees['nom_auteur']; ?></td>
                    <td>
                        <form action="db/suppression.php" method="POST">
                            <input type="hidden" name="id" value="<?php echo $donnees['id'] ?>"/>
                            <input type="submit" name="valider" class="delete" value="Supprimer" />
                            <input type="button" name="pret" id="pret" value="pret" />
                        <select id="personnes" name="personnes" hidden="hidden">
                            <option value="personnes">People 1</option>
                            <option value="personnes">People 2</option>
                            <option value="personnes">People 3</option>
                            <option value="personnes">People 4</option>
                        </select>

                        </form>
                    </td>
                </tr>
                <?php
            }
            $reponse->closeCursor(); // Termine le traitement de la requête
            ?>
        </tbody>
    </table>

</body>

1 个答案:

答案 0 :(得分:0)

Je viens de trouver une solution qui me convient parfaitement en jQuery:

    $(document).ready(function(){
    var pret = $('.pret'), personnes = $('.personnes');
    $(pret).each(function(){
        $(this).on ('click', function(){
          $(this).next().slideToggle();
            $(personnes).hide();

        });
    });
});