Table not showing updated value in input fields updated via javascript
Table not showing updated value in input fields updated via javascript
I recently upgraded from version 1.9.4 of datatables to 1.10.23. I have a couple of input fields in the footer of my table which I am updating via javascript. After upgrading datatables, the page no longer displays the updates. E.g. I do this:
$("#input FieldId").val("100.0")
but the page still displays the previous value of the input field.
I have tried calling invalidate() and draw() on the table cell but that did not work.
Anything I am missing? Unfortunately I am not at liberty to upload any code
This question has an accepted answers - jump to answer
Answers
We’d need a test case to be able to offer any help I’m afraid. You can reproduce your issue on http://live.datatables.net .
Allan
I was able to reproduce it in live.datatables.net. Please see the below link.
http://live.datatables.net/defizapu/1/edit?html,js,output
If you click on any of the checkboxes in the table, it should add the value of the selected rows into the cell 5 and cell 7 totals in the footer of the table.
I noticed that if I remove the scrollY property in the datatable configuration it works fine. But once I add the scrolling the input field no longer updates. The only way I have gotten it to update is to destroy the datatable and reinitialize it.
There are two things you should change. When using the scrolling feature Datatables clones the header and footer to enable scrolling. This means you have two inputs with the id of
selectedTotalCell5
for example. So you will need to first find thetable.scrollTable
table then the id.Next you can use
cell().data()
to get the cell data. I updated column 5 to show this. See this example:http://live.datatables.net/webuliyu/1/edit
Kevin
Thanks so much, that did the trick! Can't believe I didn't notice the footer is cloned.