1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML
Sujet Précédent Sujet Suivant

Supprimer plusieurs lignes sélectionnées

Résolu
Utilisateur anonyme - Modifié le 29 mars 2017 à 11:34
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 - 30 mars 2017 à 17:06
Bonjour à tous,

J'ai un souci au niveau de mon code pour la suppression d'une ligne sélectionnée.
En effet, j'aimerais quand je sélectionne une ligne dans mon tableau via une case à cocher d'arriver à la supprimer.
J'aimerais aussi sélectionner plusieurs lignes et les supprimer en même temps.
La suppression côté client marche mais côté serveur elle ne fonctionne pas. Je vous remercie par avance.

Code ci-dessous : 

<div>
 <a type="button" class="delete">Supprimer</a>
</div>
<div id="msg"></div>
<table>
 <form method="post" action="delete.php"> 
    <thead>
       <tr>
          <th><input type="checkbox" id="head"></th>
          <th>Name</th>
          <th>Delete</th>
       </tr>
    </thead>
    <tbody>
       <?php
          // connexion à la Bd
          require_once("db.php");
 
          // requête 
          $sql = "SELECT * FROM cat ORDER BY cat_id DESC";
          $req = $db->prepare($sql);
          $req->execute() or die(print_r($req->errorInfo()));
          $rows = $req->fetchAll();
 
          foreach($rows as $row) {
       ?>
       <tr data-row-id="<?=$row["cat_id"];?>">
          <td><input type="checkbox" class="check" data-id="<?=$row["cat_id"];?>"></td>
          <td><?=$row["cat_name"];?></td>
          <td><a class="remove" data-id="<?=$row["cat_id"];?>" href="javascript: void(0)"><img src="supprimer.jpg" alt="supprimer"></a></td>
       </tr>
       <input type="hidden" name="cat_delete" value="<?=$row["cat_id"];?>">
       <?php
          }
       ?> 
    </tbody>
 </form>
</table>


<script>
          $(document).ready(function(){
                $('#head').on('click', function(e) {
                    if($(this).is(':checked', true)) {
                        $(".check").prop('checked', true);  
                    } else {  
                        $(".check").prop('checked', false);  
                    }  
                });
 
                $('.delete').on('click', function(e) {
                   e.preventDefault();
 
                   var $this = $(this); 
                   var cat_delete = $this.find('[name="cat_delete"]').val();
                   var all = []; 
 
                     $(".check:checked").each(function() {  
                         all.push($(this).attr('data-id'));
                     });  
 
                     if(all.length <=0) {  
                         alert("Veuillez sélectionner une ligne !");  
                     } else {  
                         var DELETE = "Voulez-vous vraiment supprimer cette ligne ?";  
                         var check = confirm(DELETE); 
 
                         if(check == true){ 
                             $.ajax({   
                                 type: "POST",  
                                 url: "delete.php",  
                                 cache:false,  
                                 data: $this.serialize(), 
                                 beforeSend: function() {
                                    $this.after('<img src="loader.gif" alt="loading" id="loading">');
                                }, 
                                 success: function(response) {
                                  console.log(response);   
 
                                     $("#loading").hide();  
                                     $("#msg").html(response);
                                 }   
                             });
 
                            $.each(all, function(index, value) {
                               $('table tr').filter("[data-row-id='" + value + "']").remove();
                            });
                         }  
                     }  
                 });
 
                 $('.remove').on('click', function(e) {
                     var DELETE = "Voulez-vous vraiment supprimer cette ligne ?";  
                      var check = confirm(DELETE);  
                      if(check == true){
                          $('table tr').filter("[data-row-id='" + $(this).attr('data-id') + "']").remove();
                      }
                 });
             });
       </script>


// fichier delete.php
require_once("db.php");
 
$cat_delete = $_POST['cat_delete'];
 
if (isset($cat_delete)){
 // requête 
 $q = array('cat_delete'=>$cat_delete);
 $sql = "DELETE FROM cat WHERE cat_id = :cat_delete";
 $req = $db->prepare($sql);
 $req->execute($q) or die(print_r($req->errorInfo()));
}

4 réponses

Réponse 1 / 4
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356
29 mars 2017 à 11:46
Bonjour,

Regarde côté ajax ... 
  data: $this.serialize(),


Et côté php : 
$cat_delete = $_POST['cat_delete'];



Ne vois tu pas l'erreur ?


Fais donc, côté php, un 
 print_r($_POST);
. et regarde ce que ça t'affiche (dans la CONSOLE de ton navigateur)

0
Réponse 2 / 4
Utilisateur anonyme
29 mars 2017 à 12:06
Bonjour @jordane45,

Merci encore pour ta contribution.
En faisant ceci dans mon code : 


// fichier delete.php
require_once("db.php");
 
$cat_delete = $_POST['cat_delete'];
 
if (isset($cat_delete)){
 // requête 
 $q = array('cat_delete'=>$cat_delete);
 $sql = "DELETE FROM cat WHERE cat_id = :cat_delete";
 $req = $db->prepare($sql);
 $req->execute($q) or die(print_r($req->errorInfo()));
} else {
   echo 'erreur !';
}


J'ai l'erreur qui s'affiche mais un 
print_r($_POST);
ne me revoie rien.

Cordialement,
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356
29 mars 2017 à 18:52
J'ai l'erreur qui s'affiche

Quelle erreur ?

mais un print_r($_POST); ne me revoie rien

Ca te retourne au moins un ARRAY vide non ?
Comment "vérifies" tu ? Dans quel écran ?
=> Il faut regarder dans la console du navigateur au niveau de la requete ajax....


Pour les tests on va faire un truc en plus: 
var datas = $this.serialize();
console.log(datas);
 $.ajax({   
                                 type: "POST",  
                                 url: "delete.php",  
                                 cache:false,  
                                 data: datas, 
                                 beforeSend: function() {
                                    $this.after('<img src="loader.gif" alt="loading" id="loading">');
                                }, 
                                 success: function(response) {
                                  console.log(response);   
 
                                     $("#loading").hide();  
                                     $("#msg").html(response);
                                 }   
                             });


Que donne ceci par exemple ?
0
Réponse 3 / 4
Utilisateur anonyme
29 mars 2017 à 22:00
La console m'affiche ceci : Notice: Undefined index: cat_delete in C:\www\delete.php on line 5
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356
29 mars 2017 à 23:43
Comme tu ne sembles pas le trouver par toi même .... tu n'envoie RIEN vers ton fichier PHP ....

Modifie ton code comme ceci : 
if(check == true){ 
                         var datas = {rows_to_delete:JSON.stringify(all)};
                          //console.log(datas);
                             $.ajax({   
                                 type: "POST",  
                                 url: "delete.php",  
                                 cache:false,  
                                 data: datas, 
                                 beforeSend: function() {
                                    $this.after('<img src="loader.gif" alt="loading" id="loading">');
                                }, 
                                 success: function(response) {
                                  console.log(response);   
 
                                     $("#loading").hide();  
                                     $("#msg").html(response);
                                 }   
                             });
 
                            $.each(all, function(index, value) {
                               $('table tr').filter("[data-row-id='" + value + "']").remove();
                            });
                         }


... pour ce qui est du PHP ... je te laisse réflechir (mais.. petit indice : BOUCLE )
0
Utilisateur anonyme > jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
30 mars 2017 à 09:58
Tu compliques trop les choses et tu tournes autour.
Ce que je cherche à comprendre c'est juste la manière de récupérer mon tableau en php.
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356 > Utilisateur anonyme
30 mars 2017 à 11:07
Tu crois que je t'ai donné quoi comme code ????
Tu l'as testé au moins ?
0
Utilisateur anonyme > jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
Modifié le 30 mars 2017 à 11:22
Je l'ai testé mais je n'ai rien comme résultat à part cette : TypeError: b is undefined 

.........

var elm = $(this).find('[name="cat_delete"]').val();
var all = [];

if(check == true){ 
       var datas = {elm:JSON.stringify(all)};
       //console.log(datas);
        $.ajax({   
                 type: "POST",  
                 url: "delete.php",  
                 cache:false,  
                 data: 'ref='+datas, 
                 beforeSend: function() {
                         $this.after('<img src="loader.gif" alt="loading" id="loading">');
                  }, 
                  success: function(response) {
                         console.log(response);   
 
                          $("#loading").hide();  
                          $("#msg").html(response);
                     }   
             });
 
             $.each(all, function(index, value) {
                    $('table tr').filter("[data-row-id='" + value + "']").remove();
              });
}


// fichier delete.php
require_once("db.php");
 
$ref = $_POST['ref'];
 
if (isset($ref)){
       foreach ($ref as $val) { 
             $q = array('ref'=>$val);
             $sql = "DELETE FROM cat WHERE cat_id = :ref";
             $req = $db->prepare($sql);
             $req->execute($q) or die(print_r($req->errorInfo()));
       }
} else {
     echo 'erreur !';
}
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356 > Utilisateur anonyme
30 mars 2017 à 14:48
Pourrais tu, le temps des tests .. modifier ton fichier php (delete.php) pour n'y mettre QUE ceci : 
print_r($_POST);

et nous dire ce que ça te retourne dans la console ?
Car j'ai testé chez moi... et ça fonctionne parfaitement.
0
Réponse 4 / 4
Utilisateur anonyme
Modifié le 30 mars 2017 à 16:19
J'ai remplacé cette ligne : 
var datas = {elm:JSON.stringify(all)};
par celle-ci : 
var datas = all.join(",");
et ça marche maintenant.

Un autre petit souci ce que je n'arrive pas à supprimer plusieurs lignes sélectionnées en même temps. Si j'essaye de le faire voici l'erreur que ça m'affiche : Conversion failed when converting the varchar value '6,5' to data type int.
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356
30 mars 2017 à 17:00
il faut que tu transformes cette liste en ARRAY, puis que dans ton code php tu BOUCLES dessus (comme je te l'avais indiqué dans un précédent message)
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
 356
30 mars 2017 à 17:06
Tu aurais pu laisser le JSON.stringify
par contre côté PHP tu devais, pour récupérer ta variable en ARRAY faire : 
<?php

//récupération de la variable POST
$elmarr = !empty($_POST['elm']) ? $_POST['elm'] : NULL;
//transformation en ARRAY
$arr_elm = json_decode(stripslashes($elmarr));


//boucle dessus
$result = 'ok';
foreach($arr_elm as $val){
  $q = array(':ref'=>$val);
  $sql = "DELETE FROM cat WHERE cat_id = :ref";
   try{    
       $req = $db->prepare($sql);
       $req->execute($q) ;
   }catch(Exception $e){
     //voila comment on gere les erreurs en PDO
      $result = "Error ! ".$e->getMessage();
   }
}


//renvoie des données en JSON vers le javascript
echo json_encode($result);


?>
0