How to set where the controls are added ?

xavier

Hi,

I would like to put within the same div the .filter and the tableTools

I suspect that is set by "sDom", but I don't understand the 'T<"clear">lfrtip',

How can I wrap everything into a div class="controlbox" for instance ?

I would also like to have this wrapper div defined in the html without js, to avoid the "jumpy" effect. is it possible to tell datatables where to insert in the dom ?
(by having a min-height set)
.controlbox {min-height: 30px;background....}

allan

Hi xavier,

To wrap everything into "controlbox":

[code]
sDom: '<"controlbox"T<"clear">lfrtip>'
[/code]
The same principle can be applied to move the TableTools element around as you need:

[code]
sDom: '<"controlbox"lrtip>'
[/code]
etc.

If you want this controlbox element defined in the HTML - then you don't need to put it into the sDom (indeed that would be bad since it would add another one in), you just need to wrap your table in it.

[code]

xavier

Thanks, gets clearer in my mind.

Is is possible to have

[code]

allan

Hi xavier,

Not really if your HTML is already defined - the sDom parameter only allows for changes in the DOM structure around the table itself. What you would need to do is some kind of "post processing" such that once DataTables has finished it's initialisation then you move the filtering input / TableTools etc to where you want them to be using appendChild() etc. This _should_ happen so quickly that the rendering engine won't actually show it in the position that DataTables inserts it into, so your end users will not see the 'flicker'.

Another option might be to use sDom like:

[code]
sDom: '<"controlbox"T<"clear">lfr>tip' // or whatever
[/code]
And then remove the original controlbox element from the DOM when the initialisation is complete - again it should happen so fast that it won't be seen... Beyond that, it's a case of hacking DataTables to make it insert elements somewhere else.

Regards,
Allan