Jquery sélectionner plusieurs cases à cocher

Question

J'ai une liste de catégories jumelées avec des cases à cocher. Je ne trouve aucune documentation sur la façon de stocker toutes les cases cochées dans un var et d'envoyer les données au serveur. J'ai besoin de supprimer de la base de données les catégories sélectionnées. Cela fait partie du code sur lequel je travaille.

var cat_id = $('check_box').attr("id"); //gets the id of the checked category 
var dataString = 'cat_id=' + cat_id; //should send all the selected checkbox IDs 
$('.delete').click(function() 
{ 
    $.ajax({ 
     type: "POST", 
     url: "edit_categories.php", 
     data: dataString, 
     cache: false, 
     success: function(html) 
     { 
      window.location.reload(true); 
     } 
    });//end ajax 
});//end click function 

Les cases à cocher sont créés en utilisant dynamiquement:

<input type="checkbox" name="check_box" class="check_box" 
    id="<?php echo $cat_id; ?>" /> 

Chaque case aura un identifiant unique et combien ils sont varie. Dans les edit_categories.php, j'ai juste un mysql pour supprimer les catégories où cat_id = $ _POST ['cat_id'] mais je n'arrive pas à comprendre comment obtenir tous les identifiants des cases cochées.

Answer 1

Vous pouvez utiliser .map() pour obtenir une chaîne d'ID de cases à cocher, comme ceci:

var cat_id = $(':checkbox:checked').map(function() { 
       return this.id; 
      }).get().join(','); 

Cela produirait une chaîne comme "CheckBox1,Checkbox2,Checkbox3" pour l'envoi côté serveur . Là, vous pouvez simplement faire un .split(",") sur la chaîne pour obtenir un tableau des ID avec lesquels travailler.

Answer 2

$ ('form') serialize() peut être utile -. Jeter un oeil à ajaxForm qui est génial ...

pour vos cases à cocher - changer le nom de 'check_box []' et ensemble la valeur de cat_id par opposition à son ID. Vous devriez alors être en mesure d'accéder à $ _POST ['cat_id] qui devrait être un tableau des valeurs affichées.

vérifiez-le en utilisant var_dump ($ _POST ['cat_id']);

Answer 3

Essayez quelque chose comme ceci:

var keysToDelete = ''; 
$('.check_box:checked').each(function() { 
    keysToDelete+= $(this).attr("id"); 
}); 

dataString= 'cat_id='+keysToDelete; 
// continue down to the ajax post