Table "doesn't work" after reinitialization

Table "doesn't work" after reinitialization

raquoraquo Posts: 7Questions: 3Answers: 0

We have a table on a page which works fine on page load. After doing a new search and repopulating the table with Ajax from the server it seems like the table doesn't work as intended anymore. For example, "table.rows({selected: true}).data() " doesn't return anything anymore, and double click on a row doesn't work either.

I'm guessing some re-initialization steps need to be done, but what exactly? Any ideas?

Answers

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    After doing a new search and repopulating the table with Ajax from the server

    How are you doing this? See this FAQ if you are not using Datatables APIs to repopulate the data.

    Kevin

  • raquoraquo Posts: 7Questions: 3Answers: 0

    Looks like we're doing a DataTable().clear().destroy() and then creating a new table with the same ID, by creating $("#sameID").DataTable({ lots of options here });

    (it's not my code from the beginning, I'm just trying to fix this) :)

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    lots of options here

    Does this have ajax to fetch the data or are you doing this in a different way. Basically the question is how are you fetching the data then how are you populating the table. Can you post a link to your page or a test case replicating the issue so we can see the code flow?
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

  • raquoraquo Posts: 7Questions: 3Answers: 0

    Hmm, no we do a regular Jquery AJAX call to get data, and then create a new table when that is done. So it looks like we're doing stuff the wrong way around.

    I can't send a link to the page since it's login only on a premium service. But essentially whenever I press the search button, we do a Ajax call to get new data, and then within .always() we do a clear().destroy() of the table, and create a new one. For some reason we also do button onclick setups on the newly created table even though these buttons are located outside...

    I guess the proper procedure is to clear the table on search, and fetch the data through the ajax option? Will look into this.

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    Its hard to say exactly what the problem is without at least seeing your JS code. You only need to destroy the Datatable if you are changing the config.

    You can use your jQuery ajax() request to repopulate the table. If you don't need to change the config you can use clear() then rows.add() with draw() to populate the table with the new data.

    Or you can use ajax with ajax.data as a function to send dynamic parameters to the server. Use ajax.reload() to fetch the new data.

    HTH,
    Kevin

  • raquoraquo Posts: 7Questions: 3Answers: 0

    We basically create the exact same datatable again, so I don't think we need to change the config. So clear() and row.add() should really do the trick.

    Will have a look at your documentation. Is there a more complete example where you clear a table and repopulate it with ajax?

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    Here is an example:
    http://live.datatables.net/xusupiqu/1/edit

    Kevin

This discussion has been closed.