Add Row Function

Add Row Function

justivandevjustivandev Posts: 3Questions: 1Answers: 0

Hello!

Can somebody tell me why this code is working with static javascript object but doesn't work if the data source is from an ajax? Basically I'm trying to follow a tutorial for adding rows. Please ignore the console.log(). I'm just trying to check if there is a difference in the data of the two procedure. Thank you!

buttons: [{
  extend: "selected",
  text: 'Duplicate',
  action: function (e, dt, node, config) {
    var rowData = table.rows({ selected: true }).data().toArray();
    console.log(rowData[0])
     var rowNode = table
    .row.add(rowData[0])
    .draw(false)
    .node();
    
    $(rowNode)
    .css('color', 'red')
    .animate({ color: 'black' });
    }
}]

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736

    The row.add() and rows.add() APIs work the same no matter what the data source is. As long as the data structure defined for the Datatable is the same as the data you are adding it should work. Looks like you are getting the selected rows from a table then re-adding the first row to the same table so the data structure is the same.

    Look for errors in the browser's console. If you still need help please post a link to your page or a test case replicating the issue so we can help debug.
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

  • justivandevjustivandev Posts: 3Questions: 1Answers: 0

    Hi kthorngren,

    Sorry I forgot to mention that there's no error in the console. It just does not work.

    I'm not sure how I can provide a test case for the code base in ajax as the database sits locally on my pc but here's the working code based on the JavaScript object.

    http://live.datatables.net/fumuwuna/1/

    The only difference is that the ajax uses this option ajax: "/api/data" and that link returns the data format mentioned here. https://datatables.net/examples/ajax/objects.html.

    Everything else is the same but as soon as I use ajax, it does not work anymore. Initially, I thought it's because of the draw() so I added false. But still it did not work.

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736
    edited July 2022 Answer ✓

    You can get Ajax templates JS BIn here for your test case. I updated your test case to use Ajax data and it works as expected.
    http://live.datatables.net/fumuwuna/2/edit

    Are you using server side processing? Is yes then client side processes like row.add() doesn't work. You will need to add the row to the server DB then use draw() or ajax.reload() to fetch the updated data.

    Can you update the test case to show the issue or provide a link to a test case with the issue. Without seeing the problem its hard to make suggestions.

    Kevin

  • justivandevjustivandev Posts: 3Questions: 1Answers: 0

    Hi kthorngren,

    Thank you. You're right. It's working. I'm not sure why it's not working on my current project but I just copied the same code to a new file and remove the other codes and it's working fine now. Now I just need to check which code is preventing the 'duplicate' to happen on my current project. Thanks again.

Sign In or Register to comment.