vérifie toutes les cases de la Table de données, y compris les lignes cachées

Je suis en train de faire une fonction qui vérifie que toutes les cases de la Table de données, y compris les lignes cachées.
Voici le code html de la "case" de la colonne:

<div class="usersTable" id="userTable">
    <table cellpadding="0" cellspacing="0" id="customersList" >
        <thead>
            <tr>
                <th><input type="checkbox" name="selectall" id="selectall" class="selectall"/></th>
                <th width="200">val1</th>
                <th width="80px">val2</th>
                <th width="70px">val3</th>
                <th width="450">val4</th>
                <th width="60px">val5</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
    </table>
</div>

Bouton envoyer:

<input type='button' value='select all' id='selectallboxes' name='selectallboxes' />

Et le JQuery, le code ne fonctionne pas:

$(function () {         
    otable = $('#customersList').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "aLengthMenu" : [ [10,20,50,100,1000], [10,20,50,100,1000] ],
        "iDisplayLength": 100,
        "bProcessing": true,
        "bServerSide": true,
        "aaSorting":[],         
        "iDisplayStart": 0,
        "sAjaxSource": "filename",
        ....

$("#selectallboxes").click ( function () {
        alert(dt.fnGetNodes().length + ' is total number')
        var selected = new Array();
        $('input', dt.fnGetNodes()).each( function() {
                $(this).attr('checked','checked');
                selected.push($(this).val());                       
        } );
         //convert to a string
        var mystring = selected.length;
        alert(mystring);
})
Qu'advient-il si vous changez $("#selectallboxes").click à $("#selectall").click?
Cela ne ferait que créer un événement click pour le réel cases à cocher ne pas le bouton sélectionner tout, le problème est la logique dans l'événement click de ne pas le gestionnaire d'
Mon erreur. Je lisais correctement la question.
Merci @DavidBarker. C'est le droit.
Je dois ajouter ce commentaire que ci-dessus le code ne fonctionne que pour la première page et d'alerte de retourner le nombre d'éléments dans cette page uniquement.

OriginalL'auteur Farhad | 2013-03-17

  1. 8

    Essayer:

    $("#selectallboxes").click(function () {
    var selected = new Array();
    $(otable.fnGetNodes()).find(':checkbox').each(function () {
        $this = $(this);
        $this.attr('checked', 'checked');
        selected.push($this.val());
    });
    //convert to a string
    var mystring = selected.join();
    alert(mystring);
});

    .length vous donne la longueur du tableau. J'ai utilisé join() pour rejoindre le tableau en une chaîne de caractères. DataTable est .fnGetNodes() vous donne toutes les lignes de la table, y compris ceux qui sont cachés.

    Il ne fonctionne pas.
    J'imagine, parce que "bServerSide" est vrai,je dois le gérer côté serveur. Je pense que dans ce cas, toutes les données n'est pas extraire au premier abord.
    +1 pour votre cette ligne de code $(otable.fnGetNodes()).find(':checkbox').chaque, vous sauver ma journée
    Depuis les tables de données v1.10, $(otable.fnGetNodes()) devrait maintenant être: $(otable.rows().nodes())

    OriginalL'auteur darshanags

  2. 0

    Essayer quelque chose comme

    $("#selectallboxes").click ( function () {
     var selected = [];
    $('input:checkbox', otable).each( function() {
        selected.push($(this).prop('checked', true).val());                       
    } );
    //convert to a string
    alert(selected.join());
})

    OriginalL'auteur Arun P Johny

  3. 0

    Ok, donc ce doit être ce que vous êtes après, vous trouverez tous les la page en cours <tr>'s et du cycle à travers eux à l'aide de tables de données _ API. Vous pouvez changer le filtre à répondre à vos besoins pour sélectionner plusieurs lignes si vous le voulez, ce est documentée dans les tables de données de la documentation.

    $("#selectallboxes").click ( function () 
{
    var selected = new Array();

    //Use the _ function instead to filter the rows to the visible
    var data = oTable._('tr', {"filter":"applied"});

    $.each(data, function(key, index)
    {
        var input = $(this).find('input[type="checkbox"]');

        input.attr('checked', 'checked');

        selected.push(input.val());
    });

    //convert to a string
    var mystring = selected.length;

    alert(mystring);
});
    il ne fonctionne pas malheureusement. Le résultat est le même avec le passé.
    juste repéré, vous êtes de mettre le <input> dans un <th> tag, ils auraient besoin d'être dans <td>'s, pour `fnGetNodes()` pour les ramasser
    J'ai ajouté cette ligne à la première ligne de ma fonction, afin d'obtenir un meilleur résultat: alert(otable.fnGetNodes().longueur + "est total numéro de ligne') mais ce retourner le nombre d'éléments sur la première page!
    En fait, elle renvoie le nombre total de nœuds dans le <tbody> pas seulement les nœuds affichés, c'est ce que cette fonction n', vous pouvez exécuter une vérification pour $(this).is(':visible') pour voir si elle est affichée ou pas.
    - Je modifier ma question, s'il vous plaît vérifier.

    OriginalL'auteur David Barker

  4. 0

    fnGetNodes() donnera uniquement les lignes qui sont visibles, il est une extension pour obtenir les lignes masquées en raison de la pagination fnGetHiddenNodes(), mais qui fonctionne avec jquery datatables la version 1.9, il est de mise à jour pour le même en jquery datatables 1.10 mais ce n'est pas de travail.
    Vous pouvez stocker vos données reçu à partir de la requête ajax dans un tableau et ensuite en fonction de l'état de la case à cocher, cliquez sur événement re-dessiner un tableau avec les données d'entrée et de(case à cocher) avec l'attribut sélectionné.

    OriginalL'auteur Vivek Tiwari