Supprimer plusieurs checkbox avec une requête ajax

**pthenot** · 25/11/2017, 17h33

Bonjour,
Dans mon code j'affiche plusieurs checkbox

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
 
<body>
  <div class="container">
 
<div class="row">
        <section class="col-sm-12">
        <form method="post" action="add.php" id="form-add" name="form-add" class="form-inline">
        <input type="text" name="name" placeholder="titre" class="form-control">
        <button type="submit" class="btn btn-primary" id="name" name="name">ENVOYER         
        </button>         
        </form>
        </section>
</div>
<div class="row">
        <section class="col-sm-12">
          <div class="panel panel-primary">
          <form method="post" action="formsupp.php" id="formsupp" name="formsupp" class="form-inline">
            <table class="table table-striped table-condensed">
              <div class="panel-heading"> 
                <h3 class="panel-title">EXEMPLE DE TABLEAU</h3>
              </div>
              <thead>
                <tr>
                  <th>NOM</th>
                  <th>CONTENU</th>
                </tr>
              </thead>
              <tbody>
 
                  <?php foreach ($articles as $article):?>
                      <tr>
                        <td>
                        <div class="radio">
                          <label><input type="checkbox" id="optradio[]" name="optradio[]"value="<?=$article['id'];?>"><?=$article['id'];?></label>
                          </td>
                      </div>
                      </tr>
                    <?php endforeach; ?>
                  <tr>
                    <td><input type="submit" id="bsupprim" name= "bsupprim" class="btn_danger" value"SUPPRIMER"/></td>
                  </tr>
                  </tbody>
            </table>
            </form>
          </div>
        </section>
      </div>  </div><!--container-->
</body>

J'ai un code php pour effacer les checkbox qui fonctionne

Code PHP :

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

1
2
3
4
5
6
7
8
9
10
11
 
<?php
// array map renvoie tous les éléments du tableau après avoir fait la fonction callback ici intval
$values = array_map('intval',$_POST['optradio']);
//implode — Rassemble les éléments d'un tableau en une chaîne
$values = implode(",",$values);
 
require('connection.php');
sleep(3);
$bdd->query("DELETE FROM `article` WHERE `id` IN($values)");
header('location:formulcb.php');

Mon problème est de transformer la requête php en ajax

j'ai écrit ce code pour transformer en une requète ajax

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
 
$('#formsupp').on('submit', function(e){
			e.preventDefault();
			var $form = $(this);
			$.post(
					$form.attr('action'),
					$('#formsupp').serialize())	
						.done(function(data, text, jqxhr){
							alert(jqxhr.responseText);
						//var $check = $form.find('#optradio');
						//$check.hide();
 
						})
						.fail(function(jqxhr, text){
							alert(jqxhr.responseText);
						})
						.always(function(){
 
						});					
				});

Cela fonctionne après rechargement de la page, ce qui n'est pas le but pour une requête ajax!
En fait mon problème est d'effacer les checkbox préalablement sélectionnées dans la fonction done() sans recharger.
Je n'arrive pas à retrouver la bonne écriture jquery pour sélectionner la checkbox et lui appliquer un hide().
Je vous remercie pour votre aide.

**mathieu** · 25/11/2017, 23h32

pour sélectionner les cases cochées avec jQuery, vous pouvez faire cela par exemple

Code :

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

$("input[name=\"optradio[]\"]:checked")

j'ai remarqué que vous avez plusieurs éléments avec le même identifiant.
même si cela à l'air de fonctionner maintenant, je vous conseille de corriger cela pour ne pas vous retrouver un jour avec un résultat inattendu.

**pthenot** · 26/11/2017, 15h20

Merci Mathieu pour votre réponse.
J'avais fait :

Code :

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

1
2
 
$( "input:checked" ).parent().hide();

Mais effectivement il faut mieux utiliser name.
Par contre je ne retrouve pas d’éléments avec des identifiants dupliqués.
Dans tous les cas un grand merci mais je suis un peu honteux car la solution était sur la première page de jquery.com!
Bon WE

**mathieu** · 26/11/2017, 19h48

Si vous générez plusieurs cases à cocher, elles ont toutes le même identifiant.
Vous pouvez éviter cela en mettant "as $index =>$article" dans la boucle foreach et vous aurez donc un numéro différent pour chaque case.

Supprimer plusieurs checkbox avec une requête ajax

jQuery

Vue hybride

Discussions similaires

Partager

Partager