Rerender the datatable row after update

Januraj

i have a datatable with server side implementation
in a row , i have modified some columns on clicking the save button, i need to render the row with latest data
What function i can use to achieve this?

colin

in a row , i have modified some columns on clicking the save button,

Is this using Editor? If not, you'll need to send that data back to the server, since any user operation that generates a draw will mean that data will be replaced with what is on the server. Editor is designed for this - so it would be worth looking at if you aren't using it.

Colin

Januraj

Since i have to send multiple rows data on click of another button, with normal datatables ,i wanted to re-render only one row , the data for that row is in client side on clicking of row's save button.
In normal datatables can i rerender/update the row

kthorngren

Allan states in this thread:

With server-side processing, the data shown in the table is basically readonly. Any change to the data needs a re-read from the server.

You will need to send the row to the server to save in then DB then use draw() or ajax.reload() to refresh the table.

Kevin

Januraj

the same question how to do for client side pagination

Januraj

Client side : Since i have to send multiple rows data on click of another button, with normal datatables ,i wanted to re-render only one row , the data for that row is in client side on clicking of row's save button.
In normal datatables can i rerender/update the row

kthorngren

In your submit event handler use row().data() to update the row's data then draw() to redraw the table.

Kevin

Januraj

I tried doing with row().data() , but i am actually creating cells in columns using createdcell(). They are not getting used. It is updating with normal values instead of the values from createdCell

kthorngren

columns.createdCell runs only once, when the cell is created. You will need to use rowCallback which will execute each time the row is drawn.

Kevin

Januraj

I am not able to understand the connection between the updating and using rowcallback. Can you provide any example of using rowcallBack, it would be really helpful

kthorngren

This is an editor example but the rowCallback option is used to update the state of the checkbox. If you need an example that is specific to your case then please build a simple running example showing what you have and what you want to update.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

Januraj

how to call rowcallback() when the row is updated,
like:
1. will rowcallback() gets called on row().data()
2. will rowcallback() gets called on row().data().draw()---- but on using this it is actually making a call to the server (for server side)

Januraj

2.will rowcallback() gets called on row().data().draw()---- but on using this it is actually making a call to the server (for server side)--- What if u dont want to make a call to server but just update the row

kthorngren

how to call rowcallback() when the row is updated,

rowCallback will execute when draw() is used or when other functions like searching, sorting or paging cause the table to draw.

2.will rowcallback() gets called on row().data().draw()---- but on using this it is actually making a call to the server (for server side)

As we said if you are using server side processing you need to update the data in your server database then use draw() to fetch the updated row data.

the same question how to do for client side pagination

Are you using server side processing or client side processing?

Kevin

Januraj

this is server side but dont want to send the individual row updates to server

so i want to save the individual row's data on client side and on click of another button want to send all the row's data.

---> will rowcallback() gets called on row().data().draw()---- but on using this it is actually making a call to the server (for server side)--- What if u dont want to make a call to server but just update the row

kthorngren

will rowcallback() gets called on row().data().draw()---- but on using this it is actually making a call to the server (for server side)

Yes, any draw event like calling draw(), sorting, searching or paging will send a request to the server for the current page of data. I believe you can update the table display using row().data() without the draw() but none of the callbacks, like rowCallback, will run without a draw event.

Here is an example of why this is a problem. A user updates a row and the code displays it using row().data(). The user searches or sorts the table. The updated data is now gone.

Kevin

Januraj

So there is no way to use the logic which is in createdCell() in any other function in datatables after updating the row without draw. Is it?

kthorngren

So there is no way to use the logic which is in createdCell() in any other function in datatables after updating the row without draw. Is it?

As I said before createdCell runs only once, the first time the cell is created. The rowCallback will run each time the table is drawn.

Do you need to use server side processing? See this FAQ for some details to decide.

Kevin

Januraj

Thanks @kthorngren

I tried creating sample
http://live.datatables.net/zizenuga/5/edit

May be u will get what i am trying to tell, in the 3rd column i wanted "status" appended to the value. I am achieving this using createdcell

but after updating the row gets updated but "status" is not getting appended

Can you please help me in resolving this problem

kthorngren

If all you want to do is append the string '<div class="card_art_group cell_label">"status"</div>' to the data you can use columns.render. Looks like columns.render will run without calling draw.

You would use createdCell if you wanted to dynamically update the cell, for example using jQuery addClass().

See this example:
http://live.datatables.net/wilavabi/1/edit

Kevin

Januraj

Thanks @kthorngren for helping me understand this, but i have one more doubt.
What are the possible values of "display"? for render function of the columns what is the expected return value? is it html or string?
because i am returning listView.render().$el in the render function. it is displaying [object object]

How should i return listView.render().$el

kthorngren

You need to return something that can be display4ed in HTML. Its not a Datatables requirement but what can be displayed by HTML. This w3schools example will provide more details.

Kevin

Januraj

i think i explained it wrongly.In createdCell inorder to display the same content i used
$(td).html(listView.render().$el); and it was doing it correctly.

The output of listView.render().$el is
"jQuery.fn.init [div]
0: div
length: 1"
but not understanding how to do it using columns render function

kthorngren

Sorry I'm not familiar with listView.render().$el. Can you update my example to show an example of your data so we can help?

Kevin

Januraj

i think i might not be able to put that in the test case .

the output of the "listView.render().el" is a

(div element).
But on returning this in the render function it is displaying ""[object HTMLDivElement]""

Not the actual div value

kthorngren

You can search for [object HTMLDivElement] to get some ideas of what you might need to do.

Inspect the cell with [object HTMLDivElement] to see what it looks like. Maybe that will give you an idea of what to do.

Without actually seeing an example of your data it would be difficult to provide a solution. I would look at just rendering a string that contains the div element like in the example I provided. Maybe the result of listView.render().el can be converted to a string for the render function return.

Kevin

Januraj

Thanks kevin for helping me , I will try doing that.