web-dev-qa-db-fra.com

Comment obtenir une valeur d'entrée de case à cocher de la collection de lignes dataTable?

J'ai une table qui sert de dataTable JQuery. Chaque ligne de données a une colonne de case à cocher. Les visiteurs de la page cliquent sur les cases à cocher pour sélectionner les éléments à supprimer. La pagination et le filtrage sont activés sur le dataTable, de sorte qu'un visiteur peut sélectionner une ou plusieurs cases à cocher sur différentes pages. Lorsque l'utilisateur clique sur "Supprimer", je veux pouvoir saisir la valeur de chaque case à cocher sélectionnée.

J'ai découvert comment obtenir les lignes contrôlées en tant que collection à l'aide de ceci: var rowcollection = oTable.$(".call-checkbox:checked", {"page": "all"}); Ce que je n'ai pas compris, c'est comment parcourir la collection pour saisir la valeur de l'entrée de case à cocher de chaque ligne.

Ci-dessous le script et le tableau. S'il te plaît, dis-moi qu'il me manque quelque chose d'incroyablement évident.

<script type="text/javascript" charset="utf-8">
 $(document).ready(function () {
        $('#calltable').dataTable({
            "bPaginate": true,
            "bLengthChange": true,
            "bFilter": true,
            "bSort": true,
            "bInfo": true,
            "bAutoWidth": true,
            "bStateSave": true,
            "aoColumnDefs": [
                { 'bSortable': false, 'aTargets': [ -1,0] }
            ]
        });

        // trashcan is the id of the icon users click to delete items 
        // onclick get all the checked rows and do something 
        $("#trashcan")
        .click(function () {

            var oTable = $('#calltable').dataTable();
            var rowcollection =  oTable.$(".call-checkbox:checked", {"page": "all"});
            for(var i = 0; i < rowcollection.length; i++)
            {
             //   GET THE VALUE OF THE CHECK BOX (HOW?) AND DO SOMETHING WITH IT.
             //   
            }
        });

        });
    </script>



<table id="calltable" class="pretty">
 <thead>
  <tr>
   <th><span id="check">Check</span> | 
      <span id="uncheck">U</span> | 
      <img src="/trash_16x16.gif" alt="Delete" id="trashcan" />
   </th>
   <th>phone</th>
   <th>name</th>
   <th>Status</th>
  </tr>
</thead>
<tbody>
  <tr>
   <td>
     <input type="checkbox" class="call-checkbox" value="22" />    
   </td>
   <td>8438740903</td>
   <td>Susan</td>
   <td>S</td>
  </tr>
  <tr>
    <td> 
      <input type="checkbox" class="call-checkbox" value="23" />
    </td>
    <td>9098983456</td>
    <td>Jack Sparrow</td>
    <td>S</td>
  </tr>
 </tbody>
</table>
jquerydatatable
10
D W Langham

Utilisez la fonction each au lieu de la boucle for comme ceci:

var oTable = $('#calltable').dataTable();
var rowcollection =  oTable.$(".call-checkbox:checked", {"page": "all"});
rowcollection.each(function(index,elem){
    var checkbox_value = $(elem).val();
    //Do something with 'checkbox_value'
});
20
Raúl Juárez

Ceci est ajouté dynamiquement à jquery dataTable.And Vous obtiendrez la case cochée. 

 var table = $('#tblItems').DataTable({});

Exemple:

    $(document).on('click', '#btnPrint', function () {
        var matches = [];
        var checkedcollection = table.$(".chkAccId:checked", { "page": "all" });
        checkedcollection.each(function (index, elem) {
            matches.Push($(elem).val());
        });


        var AccountsJsonString = JSON.stringify(matches);
        //console.log(AccountsJsonString);
        alert(AccountsJsonString);
    });
0
babun