web-dev-qa-db-fra.com

Comment supprimer la ligne actuelle avec le plugin jquery datatable

J'ai une colonne avec des boutons dans un tableau J'utilise un plugin datatable jQuery. Les boutons indiquent "Supprimer" et l’idée est que, lorsque vous cliquez sur ce bouton, la ligne actuelle du tableau est supprimée.

Lorsque j'appelle fnDeleteRow, cela semble fonctionner la première fois, mais plus de temps pour cette ligne, de sorte qu'il ne semble pas que la supprimer correctement.

29
leora

Essaye ça:

var row = $(this).closest("tr").get(0);
oTable.fnDeleteRow(oTable.fnGetPosition(row));

Si cela ne fonctionne pas, vérifiez le exemple

61
Jason Orendorff

Supposons que vous ayez associé une fonction à appeler lorsque l'utilisateur clique sur le bouton. La fonction serait quelque chose comme ça

function DeleteRow(event)
{
  //get the row of the cell that is clicked
  var $row = $(this).parents("tr").eq(0)
  //if you need the id you can get it as
  var rowid = $row.attr("id");
  //now you can call delete function on this row
  $row.delete(); 
}
2
Sridhar

Que dis-tu de ça:

    // Delete Row
    $('.glyphicon-minus').on("click", function() {
        configTable.row($(this).closest("tr").get(0)).remove().draw();
    });
1
Ryan Reynolds

de cette page :

$('#example tbody td').click( function () {
    /* Get the position of the current data from the node */
    var aPos = oTable.fnGetPosition( this );

    //...
} );
0
cobbal

C'est comme ça que ça marche pour moi. Dans la fonction Document Ready, j'attribue la version convertie du tableau HTML à une variable et, lorsqu'un clic est effectué sur le bouton, je passe par les parents/enfants avec JQuery et envoie la ligne obtenue en tant que paramètre à la fonction fnDeleteRow () de la bibliothèque.

Voici les commentaires de la fonction de bibliothèque. Et un exemple qui est mentionné dans la bibliothèque.

/**
* Remove a row for the table
*  @param {mixed} target The index of the row from aoData to be deleted, or
*    the TR element you want to delete
*  @param {function|null} [callBack] Callback function
*  @param {bool} [redraw=true] Redraw the table or not
*  @returns {array} The row that was deleted
*  @dtopt API
*  @deprecated Since v1.10
*
*  @example
*    $(document).ready(function() {
*      var oTable = $('#example').dataTable();
*
*      // Immediately remove the first row
*      oTable.fnDeleteRow( 0 );
*    } );
*/

// And here's how it worked for me.
var oTable;
$("document").ready(function () {
    oTable = $("#myTable").dataTable();
});

//Remove/Delete button's click.
$("a[name='deleteColumn']").click(function () {
    var $row = $(this).parent().parent();
    oTable.fnDeleteRow($row);
});
0
Cengiz Araz