editing Row with row().data()

elboffor · June 2016

Hi all,
I've managed to get the rowID added to my table, what I'm doing now though is wanting to replace a specific row (based on row ID) with an array from JSON which will follow the same format as the one used to build the table. the only difference being of course is it will only include one row and not the whole table. this seems the smartest solution, as opposed to grabbing all the data again.

I've scoured the api and fnUpdate seemed to document it all fine and I can understand that, but that is the legacy method and I'd rather use something is less likely to be depreciated.
.
all the examples for row() that I've found are given to add a row or delete a row or count them (not sure what use that is but hey ho) and no examples on how to update them.

Can someone shed some light on this and explain to me what I need to do in order to build an update?

would it be something like:

$("#table").DataTables({
                "ajax": "Ajax.asp?RT=MainData&id=123", //here is the querystring I would use to specify what row to get from the server
                "columns": [
                    { "data": "header1" },
                    { "data": "header2" },
                    { "data": "header3" }
                ]
            }).row("123");

-=-=-=-=-=-=-=-=-=-=-original question-=-=-=-=-=-=-=-=-=-=-
Hi all (allan ;)),
I currently display my data via an Ajax call and the data is brought back in JSON format as arrays.

When I've been looking at adding a row id I can only see examples of doing this by using a JSON Object.

Would I need to convert my JSON so it is in an object or is an array still ok?
if so how would I add it?

example:
currently my JSON looks like this

{
  "data": [
    [
      "Tiger Nixon",
      "System Architect",
      "Edinburgh",
      "5421"String,
      "2011/04/25",
      "$320,800"
    ],
    [
      "Garrett Winters",
      "Accountant",
      "Tokyo",
      "8422",
      "2011/07/25",
      "$170,750"
    ],
    [
      "Ashton Cox",
      "Junior Technical Author",
      "San Francisco",
      "1562",
      "2009/01/12",
      "$86,000"
    ]
   ]
}

so it omits the column name

all the examples I have seen show them as objects such as:

{
  "data": [
    {
      "DT_RowId": "row_19",
      "first_name": "Bradley",
      "last_name": "Greer",
      "position": "Software Engineer",
      "email": "b.greer@datatables.net",
      "office": "London",
      "extn": "2558",
      "age": "41",
      "salary": "132000",
      "start_date": "2012-10-13"
    }
  ]
}

Clarification would be greatly appreciated

Chris
-=-=-=-=-=-=-=-=-=-=-answer-=-=-=-=-=-=-=-=-=-=-
I just went with the second example and it works so will amend my JSON accordingly

allan · June 2016

Hi Chris,

With the row().data() method you need to first select the row you want to modify the data of, and then pass in the new data object (or array if you are using arrays, as you appear to be). So you might use:

table.row( '#myRowId' ).data( myUpdateObjectOrArray );

You should also redraw the table after an update to filtering, etc is all correct:

table.draw();

What might make this more complicated is if you have multiple rows to update. Obviously you can just loop over them and update them one at a time, which you would have to do if it is a subset of the data in the table.

If you just want to update the whole table, use ajax.reload().

Allan

elboffor · June 2016

Thank you very much allan,
I was just re-writing everything using .remove and then re-adding it with data. It's good to see it can be done in one call :)
I'll give it a go and mark as answered once I confirm it's working
Chris

elboffor · June 2016

Hi Allan,

I'm experiencing some problems with this.
For some reason whenever I specify the row ID it doesn't work.
I reverted back to using remove to check if I was building the string incorrect but that behaves in the same way.
example:

$("table").DataTable().row("#14").remove().draw();

however if I omit the id from .row() then it removes the most recent selected row (or updates when I use .data() )
example:

$("table").DataTable().row().remove().draw();

I've messed arounbd with the way it's written, ie using a var for $("table").DataTable() and also not chaining directly but I get the same results.

any idea what could be going on here?

Chris

-=-=-=-=-EDIT-=-=-=-=-
upon further inspection, it is not deleting the most recently selected row, rather just the top row of the table.
Really scratching my head on this one :(

elboffor · June 2016

well I've had to go with ajax.reload which is doing as expected. but is this not more of an impact on the server/load times?

allan · June 2016

I'm afraid I would need a link to the page to be able to debug it and understand what is going wrong. Happy to take a look if you post a link.

Allan

elboffor · June 2016

Hi Allan,
thanks for getting back to me,
As is the case with most of these posts it's no can do I'm afraid as it's on works intranet :(
Hey ho, I'll just stick with ajax.refresh
thanks for all the support though buddy, till next time ;)...

Chris

editing Row with row().data()

editing Row with row().data()

Answers

Howdy, Stranger!

Categories

DataTables

editing Row with row().data()

editing Row with row().data()

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables