Confirmation de suppression en PDO avec Alertify et Ajax

Introduction

Dans ce tutorial, nous allons voir comment supprimer un enregistrement d'une table de bases de données avec confirmation.
Lors du clic sur le lien une boite de confirmation s'affichera, cette boite sera customisé par le script Alertify JS.

Puis une fois validé une requête Ajax supprimera via un fichier PHP contenant une requête en PDO l'enregistrement voulu sans rafraichissement de la page.

Etape 1

En premier lieu, vous devez avoir une table dans votre base de données (je parle ici en local) pour faire les tests.
Dans la section (HEAD) de votre page insérer l'appel de ces trois fichiers via CDN.
<!-- JavaScript -->
<script src="https://cdn.jsdelivr.net/alertifyjs/1.8.0/alertify.min.js"></script>
<!-- CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/alertifyjs/1.8.0/css/alertify.min.css"/>
<!-- Default theme -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/alertifyjs/1.8.0/css/themes/default.min.css"/>

Etape 2

Dans cette 2éme étapes nous allons créer le fichier (inlinemod.js)

        <script>
        //config alertify
        alertify.defaults.glossary.title = 'Confirmation suppression';
        alertify.defaults.glossary.ok = 'Supprimer';
        alertify.defaults.glossary.cancel = 'Annuler';
        $(document).ready(function()
        {
              $('table#menuTable td a.delete').click(function()
              {
                          currentUserName = $(this).data("user-name");
                              var id = $(this).parent().parent().attr('id');
                              var data = 'id=' + id ;
                              var parent = $(this).parent().parent();
                              
                          alertify.confirm("Etes vous sur de vouloir supprimer cet enregistement : <br>( " + currentUserName + ") ? ", function (e) {
                             if (e) {
                                $.ajax(
                                {
                                       type: "POST",
                                       url: "page_delete.php",
                                       data: data,
                                       cache: false,
                                    
                                       success: function()
                                       {
                                            parent.fadeOut('slow', function() {$(this).remove();});
                                       }
                                 });				
                                 alertify.set('notifier','position', 'top-left');
                                 //alertify.success('Current position : ' + alertify.get('notifier','position'));
                                 alertify.success("Suppression effectuée : <br> ( " + currentUserName + ")");
                             } else {
                                alertify.error("Annulation de suppression");
                             }
                          });
                              
                          return false;
                       });
        
        });//fin ready
        </script>
        

Le fichier (page_delete.php)

Ce fichier aussi doit être exempt de tous code. Puis ajouter le code ci-dessous. Ce code permet la mise à jour des nouvelles valeurs dans la table de la base de données.

            <?php 
            require_once('Connections/cnxPDO.php'); 
            $id=$_POST['id'];
            try {
                $sql = "DELETE FROM rss_fichier WHERE id = :id";
                $query = $PDO->prepare($sql);
                $query->bindParam(':id', $_POST['id'], PDO::PARAM_INT);
                $query->execute();
            } catch (PDOException $e) {
                echo 'PDOException : '.  $e->getMessage();
            }
            ?> 
        

Etape 3

Maintenant que nous avons créés nos deux fichiers et que vous les avez paramétré en fonction de votre table de base de données, nous allons maintenant créer le lien.
<a class="delete" href="#" data-user-name="N° <?php echo $row_RsListeFlux['id']; ?> <?php echo $row_RsListeFlux['lien'];?>">**</a>
Lors du clic sur ce lien, cela affichera dans la boite de confirmation l'id et le nom de l'enregistrement pour lequel vous souhaitez supprimer.

Il va de soi que ce genre de lien se trouve dans une boucle WHILE.

Conclusion

Avec ce genre de script cela permet de confirmer via une boite customisée la suppression d'un enregistrement..

Bon dev