Is it possible to run DataTables 1 & 2 on the same page?

redfellow

Because of code not maintained by us, we're in a tough spot where we need to load both DataTables 1 & 2 on same pages, at the same time.

I couldn't find anything similar to jQuery noConflict from the docs, but perhaps I'm looking with wrong keywords.

Perhaps by moving jQuery.fn.dataTable to something like jQuery.fn.dataTable1 & 2 so they wouldn't conflict.

allan

No, I'm afraid it was never a design goal to allow both to run on the same page at the same time. It might be possible to do something like:

<script src="https://cdn.datatables.net/1.13.11/js/jquery.dataTables.js"></script>
<script>
  $.fn.dataTable1 = $.fn.dataTable;
</script>
<script src="https://cdn.datatables.net/2.1.4/js/dataTables.js"></script>

But I think that would probably be the least of the issues. You've have CSS conflicts, and the styling packages would get horribly confused.

If a third party library that must be on the page loaded DT1, then I'm not sure that you've got much choice other than to use DT1 yourself.

Allan

redfellow

I was able to get around the issue by modifying the old DataTables JS used by the legacy code (basically redirect the JS call to a modified DT1 JS) and overriding the calls in the legacy code to use DataTable_old & dataTable_old. Now both versions work simultaneously.

Here's the end result of the DT1 library for reference, in case someone needs to get around the same issue at some point: https://paste.fo/raw/m7b1c7b818e4

I'm aware I might have to continue the modifications if there are any conflicting Plugins.

allan

Nice one - good to hear you managed to get it working for your use case

Allan