TableTools Button Location Outside of sDom

JenMir

Hi,

I want to have a "Copy" (TableTools) button outside of the "sDom" control area (in a completely separate area of the page)

Not sure what I should be looking to do.. is there a way to move it, or add the code manually, or "click" the button through javascript?

Thanks!

allan

In fnInitComplete ( http://datatables.net/usage/callbacks#fnInitComplete ) you could just move the DOM element that DataTables has created to wherever you want on the document.

Allan

JenMir

Hi allan,

Thanks for the response, can I please ask for a hint on how to do that?

I tried something along the lines of:

var $x = $('#toolbar').html();
$('#toolbar').html("");
$('#newdiv').html($x);

I see the button in the new location, but clicking it does nothing, I assume due to something dom related that is above my head.

allan

[code]
fnInitComplete: function ( oSettings ) {
document.appendChild( $('div.DTTT_container')[0] );
} );
[/code]
would stick it at the bottom of the document.

Allan

JenMir

Hi Allan,

I just donated a little bit. It's such an awesome tool, and your tireless support is inspiring, I hope I can afford to donate more again in the future.

I'm kind of embarrassed to post a link since the page and code is so hacked together but would you have any idea why the "Copy" button here doesn't always work in FF (4.0.1), and doesn't work at all in Chrome (12.0.742.100)?

http://www.allpennyauctions.com/auctions/ffcbe2f26e4f5bf0/

(In the middle left of the page, "End Prices for this Item", click the top-right icon for the table, the copy button is in the footer of that table).

In FF it works sometimes when I reload the page. It works almost never when I shift-reload.

allan

Hi JenMir,

Thanks very much for the link! It makes diagnosing the problem so much easier. Thanks also for the donation! And congratulations on being the first to post in the new forums ;-)

So to your issue - basically the problem is that the Flash button which is used to do the copy to clipboard action has a height and width of 0. The reason for this is that the table is hidden when it is initialised - and thus has no height or width.

So the solution is to give it height and width when it is made visible and this is done through the fnResizeButtons API method: http://datatables.net/extras/tabletools/api#fnResizeButtons (there is a companion method called fnResizeRequired which can be useful to tell you if a resize is required or not).

Basically what you need to do is attach an event handler to the tab of the table display which will call fnResizeButtons when the tab is made visible (at which point it has height and width).

Regards,
Allan

JenMir

Woot! Working now, thanks so much!

Cool that I was the first poster on the new forums. Vanilla is awesome, I've thought many times about switching myself after using it here on datatables.net.

PS: I feel bad bothering you more, it's not a big deal, but I have this other site.. http://www.pennyauctiongrid.com/ that is just a giant datatable. It takes like 10 seconds to process in FF. Is that just unavoidable due to the FixedHeaders and large number of rows/cols, or is there a way to make it load faster?

allan

Good to hear that is working :-).

I would guess that the slowest part of the other site is FixedHeader cloning the nodes and then height matching. I think FixedHeader needs an option like FixedColumns to have the row height set manually which would provide a huge speed boost. I've made a note to do that for the next FixedColumns release.

Allan