1

I have two JQuery datatables in my C# MVC application that are currently in a partial. I have it set up so that if I select from either data table I can select a row and then if I hit another button it should transfer that row to the other table. Currently I can do the selection just fine and I can transfer on the backend just fine. My viewmodel is set up in Knockout to do the databindings that setup my JQuery DataTable (which handles styling, sorting, etc.). When I transfer I am loading a row into a staging array before the user hits a authorization button and then afterward it deletes that entry from the observable array that binds to one table and adds in that entry into the other tables observable array that is the data bind for that table. The problem is that I am not having rows get removed from my JQuery datatable when they are removed from the observeable array backing it and they are not being added to the other data table when they are added to the observeable array backing it. The second table does however get new rows added to it, but they all just say "No data available in table" and I'm thinking that I need to delete the table and then refresh it with the data that is in the observeable array.

Does anyone know how to do this with Knockout and JQuery DataTables?

Thanks!

Improve this question

1 Answer 1

Reset to default
1

I had the same problem. In detail, i get a json list of users from a rest service, store item into observablearray, create a table, and after attach the datatables plugin. The problem is when i add an item into observablearray i see new row but searching return 0 row and as well as removing an item from observablearray as no effected rows. That because datatables doesn't update its structure. Unfortunately due to delivery issue i used this workaround : i destroy and re-create datatables. This is not the cleanest and the best solution especially for large tables.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

how do you maintain the state of your table after you delete and recreate it? as soon as i clear, then delete, then recreate my table i get 0 rows found for both tables... thanks for the answer!
Unfortunately i don't store the table stare. I used $(".table").dataTable().fnClearTable() to clear data table before attache new row and $(".table").dataTable({ "bDraw" :true, "bDestroy" :true, }); to create the table.
I thought about it quickly, and you can try to add or remove data both from the datatable and observablearray. So you don't need to destroy and re-create table then you don't need to store state.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.