How can I remove jQuery UI theme from existing table?

richgrg

Hi

I'm trying to re-style a dataTable to Bootstrap that is hardcoded to use jQuery UI in the backend. Using the dataTables.bootstrap.js script it's rendering the correct markup however the jQuery UI classes are still appearing and are conflicting the Bootstrap styling

I tried setting the parameter and redrawing per below but no luck :(

oTable = jQuery(".dataTable").dataTable(); // get all current DT on page
var oSettings = oTable.fnSettings();
 oSettings.bJQueryUI  = false; // remove jQuery UI theme
oTable.fnDraw(); // Refresh

richgrg

Hi guys can anyone assist ?

richgrg

Here are JSBin's I have created demonstrating my code and its for datatTables version 1.9.4

http://live.datatables.net/dagaceri/1/edit?js,output

After much trial and error I'm guessing the only way is to destory and re-init the table?

http://live.datatables.net/vubasove/2/edit?js,output

allan

If the table has already been initialised with jQuery UI styling, then yes, you would have to destroy the table.

Setting anything in the settings object is not supported - it is not a documented API.

Allan

richgrg

Hi Allan

thanks, for clarifying re destroying the table .If setting via settings object isn't supported how else can this be done?

Richard

allan

There is no API to remove the jQuery UI styling without destroying the table. As I noted in my reply above, if that is what you want to do, you would have to destroy the table and recreate it (assuming it has to be created with jQuery UI styling in the first place - which would obviously be the best fix, to not do that).

Allan