jquery datatable add row to top

Question

I have jquery datatable that is sorting set to off. Really what I wanted was the pagination and a couple of the other features. The issue is that now when I I do my .DataTable().row.add( [] ) the row gets added to the bottom of the table. I figured out that I can just prepend to the table, but it won't "re-draw" the table.

How would I make .DataTable().row.add( [] ) prepend instead of append the data?

The position of the inserted row is determined by any sorting that exists on the DataTable. Of course, you could just use `prepend()` and then `draw()`. — BenM, Aug 20 '15 at 21:43
If redrawing the table after adding the row works as a solution, there are a number of ways to do this, but before I share, let me know if this will work for you and I'll submit an answer. — jonmrich, Aug 21 '15 at 14:22
I tried that, but what happens is that the item gets prepended then when I do DataTable.draw() the prepeneded item gets removed and only the original table is shown. It is almost like the draw removes the new item. — Mav2287, Aug 21 '15 at 15:30

score 2 · Accepted Answer · answered Aug 25 '15 at 21:27

In case anyone else needs to do this I ended up going with this code. DataTableVAR would be for whatever you are using as your variable for your DataTable.

    var index = 0, //0 sets the index as the first row
        rowCount = DataTableVAR.data().length-1,
        insertedRow = DataTableVAR.row(rowCount).data(),
        tempRow;

    for (var i=rowCount;i>index;i--) {
        tempRow = DataTableVAR.row(i-1).data();
        DataTableVAR.row(i).data(tempRow);
        DataTableVAR.row(i-1).data(insertedRow);
    }     
    //refresh the page
    DataTableVAR.page(currentPage).draw(false);

jquery datatable add row to top

1 Answers1