web-dev-qa-db-fra.com

Datatables .row () est indéfini

je veux des lignes supprimer en cliquant simplement sur le bouton .. connexes tableaux de données est fonctionne, je peux utiliser une fonction de base comme genre et recherche dans datatable, mais quand je clique sur le bouton juste dit simplement erreur non définie:

pour votre information, j'utilise datatable 1.10 et jquery 1.10.2 enter image description here

Code:

<table cellpadding="0" cellspacing="0" border="0" class="row-border" id="table">
<thead>
    <th>Video ID</th>
    <th>Filename</th>
    <th>Action</th>
</thead>
<tbody>
    <td>1</td>
    <td>ABCD</td>
    <td><input type='button' name='deleteBtn' value='Delete' />
</tbody>
<tfoot>
    <tr>
        <th>Video ID</th>
        <th>Filename</th>
        <th>Action</th>
    </tr>
</tfoot>
</table>

<script src="jquery.min.js"></script>
<script src="jquery.dataTables.min.js"></script>
<script type="text/javascript">
var table = $('#table').dataTable( {} );

$('#table tbody').on('click',"input[type='button']",function() {
    table
        .row( $(this).parents('tr') )**
        .remove()
        .draw();
});
</script>
</body>
</html>
22
Shin Dapaty

Cela ne fonctionne pas, car il existe une énorme différence entre le constructeur dataTable() et le constructeur DataTable() introduit dans 1.10.x ( voir la documentation ):

La différence entre les deux est que le premier renvoie un objet jQuery, tandis que le second renvoie une instance d'API DataTables.

Changez simplement

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

à

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

si vous souhaitez travailler sur la nouvelle API dataTables via la variable table.
Voir le fonctionnement de votre code -> http://jsfiddle.net/Sd6UQ/

NB: N'oubliez pas d'utiliser <tr>..</tr> et fermez <td> fonctionne correctement. dataTables peut être très sensible aux balises mal formées.

55
davidkonrad

si vous décidez de créer la table de données de cette façon

table = $ ('# table'). dataTable ({})

vous obtiendrez un objet jQuery dans la table var mais vous pouvez accéder à l'api dataTable avec l'instruction suivante

table.api ()

on pouvait le voir courir ici

http://jsfiddle.net/Sd6UQ/

vous pouvez utiliser cette technique si vous n'avez pas accès à l'instruction de création datatable

<script>
    //datatable creation is in another file
    //$('#table').dataTable( {} )

    $("button[name'deleteBtn']").click(function(){
        var row = $(this).closest("tr");
        var table = row.closest('table').dataTable();
        table.api()
             .row( row )
             .remove()
             .draw();
    })
<script>

vous pouvez le voir fonctionner ici

http://jsfiddle.net/r2ue74zn/

0
Matias Medina

Vous pouvez simplement ajouter le code suivant pour recharger datatable

//var table = $('#table').dataTable( {} );
table.ajax.reload();
0
Chandra Kumar