Avoid Order.dt event fire on dataTable load

Avoid Order.dt event fire on dataTable load

AntrikshAntriksh Posts: 33Questions: 5Answers: 0

Order.dt event is fired multiple times on dataTable initial load. I want to listen order.dt only if user clicks on header to sort a column, but it fires for setting order, draw.dt events, etc.

Please help, how to avoid those fires.
@kthorngren @colin

Replies

  • kthorngrenkthorngren Posts: 21,330Questions: 26Answers: 4,951
    edited April 2021

    Try moving the code that creates the event inside initComplete. This way it creates the event handler after all the data is loaded.

    Kevin

  • AntrikshAntriksh Posts: 33Questions: 5Answers: 0

    Hey, that didn't work. Actually whenever an existing dataTable is destroyed and re-rendered, the event "order.dt" gets fired multiple times. First few times with old table order and then with new rendered table order.

    Can we have a work around this ? Actually i wanted to do something if user clicks on any column header to sort. Or if we can listen to thead th anyway ?
    @kthorngren

  • kthorngrenkthorngren Posts: 21,330Questions: 26Answers: 4,951

    Hey, that didn't work.

    What happens, do you get errors?

    It works here:
    http://live.datatables.net/luvudifa/1/edit

    Actually whenever an existing dataTable is destroyed and re-rendered, the event "order.dt" gets fired multiple times.

    Use .off() to turn off the event handler in the function where you destroy and re-init the Datatable.

    Kevin

  • AntrikshAntriksh Posts: 33Questions: 5Answers: 0

    Thanks kevin, i used .off() function to turn off the event handler before rerendering my table, but still when the table renders, it fires order.dt with the old order and then again with the new one.

    Is it because order event gets fired before grid renders with the new data ?
    Can we do something for this ?
    @kthorngren

  • kthorngrenkthorngren Posts: 21,330Questions: 26Answers: 4,951

    I updated my example with ajax and a button to destroy and reinit Datatables. In the button event I use $('#example').off('order.dt') turn remove the event created in initComplete.
    http://live.datatables.net/luvudifa/2/edit

    See if this helps. If not please update the test case, create your own test case or provide a link to your page so we can help debug.
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

This discussion has been closed.