Discussion :

[mOscar007]

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 :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<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>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
// js
	         $(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();
	                     }
	                });
	            });

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// 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 le message Erreur ! qui s'affiche en essayant de supprimer une ligne mais quand je fais un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

print_r($_POST);

ça ne me renvoie rien.

[mathieu]

avez-vous regardé le retour de la requête AJAX dans la console de développement ?

[mOscar007]

Bonjour @mathieu,

Merci d'avoir pris le temps de me répondre.
Le retour ajax ne me revoie rien. Ça devrait me retourner au moins un array vide non?

Cdlt,

[Toufik83]

bonjour,

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
 
<div>
	<a type="button" class="delete">Supprimer</a>
</div>
<div id="msg"></div>
<table>
	<form method="post" action="delete.php" id="maforme">	
	   <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="#"><img  alt="supprimer"></a></td>
	      </tr>
	      <input type="hidden" name="cat_delete" value="<?=$row["cat_id"];?>">
	      <?php
                 }
                                 $db=null;
              ?> 
	   </tbody>
	</form>
</table>
<script type="text/javascript" src=".... ta source de jquery.js"></script>
<script type="text/javascript">
$('.remove').on('click', function(e) {// le click est sur .remove, et pas sur .delete
        let $this=$(this)
           ,id=$this.data("id");//utilise la data("id") puisque tu as mis data-id="<?=$row["cat_id"];?>" au niveau html.
        $.ajax({   
                                        type: "POST",  
                                        url: "delete.php",  
                                        cache:false,  
                                        data: {cat_delete:id}, 
                                        beforeSend: function() {
                                           $this.after('<img src="loader.gif" alt="loading" id="loading">');
                                   }, 
                                        success: function(response) {
                                         console.log(response);   
                                                $this.parents("tr").remove();//remove toute la ligne concernée.
                                                $("#loading").hide();  
                                                $("#msg").html(response);
                                        }   
                                });
});
</script>

delete.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<?php $cat_delete = $_POST['cat_delete'];
 require_once("db.php");
if (isset($cat_delete)){
	// requête 
        $q = array(':cat_delete'=>$cat_delete);//tu as oublié de mettre deux points ":" avant cat_delete.
	$sql = "DELETE FROM cat WHERE cat_id = :cat_delete";
	$req = $db->prepare($sql);
	$req->execute($q) or die(print_r($req->errorInfo()));
	echo 'suppression de :'.$cat_delete." avec succès.";
} else {
        echo 'Erreur !';
}
$db=null;