Partage
  • Partager sur Facebook
  • Partager sur Twitter

Actualiser le contenu d'un tableau

modification avec modal

2 juillet 2020 à 18:02:15

Bonjour,

j'ai actuellement un panel administrateur avec un tableau html généré en PHP et une base de donnée mysql

<table class="table table-hover">
    <thead>
        <tr>
            <th>Titre</th>
            <th>Prénom</th>
            <th>Reponse</th>
            <th>Date</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        <?php
        $req = $bdd->query('SELECT * FROM demandes ORDER BY id DESC');
        while($r = $req->fetch()) {
        ?>
        <tr>
            <td><?=$r['titre'] ?></td>
            <td><?=$r['prenom'] ?></td>
            <?php if (!empty($r['reponse'])) { ?>
            <td><?=$r['reponse'] ?></td>
            <?php } else { ?>
            <td>Pas encore de réponse</td>
            <?php } ?>
            <td><code><?=forma_date($r['date_time']) ?></code></td>
            <td class="table-action">
                <a href="#" class="action-icon text-info" data-toggle="modal" data-target="#modif-<?=$r['id'] ?>"><i class="mdi mdi-reply"></i></a>
            </td>
        </tr>
        <div class="modal fade" id="modif-<?=$r['id'] ?>">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Répondre à <?=$r['prenom'] ?></h4>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">
                        <form method="POST" async="demandes">
                            <div class="form-group">
                                <label for="reponse-<?=$r['id'] ?>">Réponse</label>
                                <input type="text" class="form-control reponse" name="reponse" id="reponse-<?=$r['id'] ?>" placeholder="Réponse" value="<?=$r['reponse'] ?>"/>
                            </div>
                            <div class="form-group text-center">
                                <input type="hidden" name="modif" value="<?=$r['id'] ?>"/>
                                <input type="hidden" name="token" value="<?=$_SESSION['token'] ?>"/>
                                <input type="submit" class="btn btn-primary" value="Mettre à jour"/>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <?php } ?>
    </tbody>
</table>

et j'aimerai lors de la modification d'une ligne (modal) actualiser seulement la ligne concerné (tr de la table) en JavaScript (ajax) sans actualiser toute la page, avez vous des solutions ?

(je peux retourner les résultats de la bdd en json avec php pour l'ajax)

Cordialement.

-
Edité par Skytylon 5 juillet 2020 à 13:41:50

  • Partager sur Facebook
  • Partager sur Twitter