How to update the display value and not the underlying value?

How to update the display value and not the underlying value?

lowrymellowrymel Posts: 30Questions: 7Answers: 0

How can I update only the displayed value for a cell that contains an underlying array where a render is being used to display the array.length?

In the example https://editor.datatables.net/examples/datatables/parentChild.html

The user count is conditioned with a render.

var siteTable = $('#sites').DataTable({
ajax: '../php/sites.php',
columns: [
{ data: 'name' },
{
data: 'users',
render: function (data) {
return data.length;
}
}
],

Since this is not persistent data (client display only) I would like to update the displayed values on Add actions and Delete Actions. Seems unnecessary to round trip reloading the table to get the counters adjusted.

Thanks in advance.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 65,489Questions: 1Answers: 10,877 Site admin

    Hi,

    Use cell().data() or row().data() to update the underlying data. Then call draw() to redraw the table with the new information.

    Regards,
    Allan

  • lowrymellowrymel Posts: 30Questions: 7Answers: 0

    Thanks for the reply. I was not concerned with updating the underlying data which is an array. What I want to do is to be able to update the number that is being generated by the render on the length of the array. So in your parentChild example each user shows as having 6 users. Functionally I want to add a new user and update the user count to 7 without doing the round trip to the server for a table update. I am envisioning having thousands of rows in the main table that each could have upto 10 child data counters. So again just trying to avoid the round trip of each change of child data. Is this possible?

  • kthorngrenkthorngren Posts: 22,388Questions: 26Answers: 5,142
    edited January 20 Answer ✓

    I would use cell().data() to update the array to add the new user then when draw() is called the render function will run updating the cell's display:

    data: 'users',
    render: function (data) {
    return data.length;
    

    Here is a simple example:
    https://live.datatables.net/vovacoxi/1/edit

    Click on a Position cell to update the User's array and update the array length dsiplay.

    Kevin

  • kthorngrenkthorngren Posts: 22,388Questions: 26Answers: 5,142

    You can do something similar with row().data() if that is more appropriate for your solution.

    Kevin

  • lowrymellowrymel Posts: 30Questions: 7Answers: 0

    Thanks kthorngren. That is a nice simple solution.

Sign In or Register to comment.