Multiple AJAX calls for a table initialized more than once?

问题

The question is tricky so I'll post the context:

1. I have a fragment on the page that gets loaded via AJAX.
2. That page contains a table that will be powered and populated by Datatables with server-side processing.
3. Everytime I load the fragment that contains a new table, I tell Datatables to boot the table from scratch, using bDestroy : true.

Problem

The AJAX calls that fetch the data as JSON keep piling up as I load new tables via AJAX.

Question

How do I keep these calls from stacking up and reduce them to a single one? Thank you.

---

Code samples (upon request)

/* datatables initializer */

$("#table").dataTable({
  bDestroy : true
, bServerSide : true
, sAjaxSource : "path/to/json.json"
, ...
});

/* script inside the AJAX loaded content. It outputs a <table>. */

$(function() {
  $("body").trigger({ type : "tableready", options : { ... } });
});

回答1:

The answer to this issue is out of DataTables' responsability. The code sample above is missing the cause of the problem.

I have built a class that binds an event to a function that empowers the table. Everytime I invoked the AJAX call that retrieved the table, the function stacked another binding on top, hence the multiple calls for data.

The solution is either to check if you have already bound that event or to unbind() the event and rebind() it again.

来源：https://stackoverflow.com/questions/6763073/multiple-ajax-calls-for-a-table-initialized-more-than-once