TableTools layout problem.
TableTools layout problem.
Corran
Posts: 10Questions: 0Answers: 0
I've added TableTools to my DataTable and everything works fine (printing, exporting, etc.). However I have a small problem with the layout.
I'm using the bJQueryUI option and after adding "sDom": '<"H"lfrT>t<"F"ip>' it uses the jQueryUI theme and that's perfect.
But unfortunately I can't get the Search input box (which I'd personally rather call Filter) and the TableTools at the same height.
Right now it looks like the link below and I would much rather get it all on one line.
http://gyazo.com/fc0db5d03394a00e186909e4abe6a52d.png
I tried changing the float and clear attributes of .TableTools but that has had no effect unfortunately.
I've also looked at changing the default icons to make them smaller (16x16) so it would fit better on one line but unfortunately the .js hardcodes the height to 30 pixels and I don't want to edit the .js file.
I'm using the bJQueryUI option and after adding "sDom": '<"H"lfrT>t<"F"ip>' it uses the jQueryUI theme and that's perfect.
But unfortunately I can't get the Search input box (which I'd personally rather call Filter) and the TableTools at the same height.
Right now it looks like the link below and I would much rather get it all on one line.
http://gyazo.com/fc0db5d03394a00e186909e4abe6a52d.png
I tried changing the float and clear attributes of .TableTools but that has had no effect unfortunately.
I've also looked at changing the default icons to make them smaller (16x16) so it would fit better on one line but unfortunately the .js hardcodes the height to 30 pixels and I don't want to edit the .js file.
This discussion has been closed.
Replies
1. Search / Filter: You can rename it using the language options: http://datatables.net/usage/i18n#oLanguage.sSearch
2. Positioning: I'd say almost certainly that you need to float the TableTools element to 'right', and adjust the width of the elements so they all fit on the same line. Firebug should help here, but I can't say for certain what needs changed from a png :-)
3. Icons: Agreed - hardcoding numbers like that is rubbish. TableTools 2 will be taking steps to not repeat that mistake.
Allan
Thanks for the quick response!
I took another look at it and the floating was easy to fix by putting a float:left on #exh_sec_table_filter.
I had initially been looking for a more graceful solution where I didn't need to create a new style but just adapt the existing TableTools ones.
But this works so I'm not complaining.
I hadn't taken a look at the Internationalisation yet but that works perfect too. :)
I'm thinking I might actually edit the .js for the icons if there won't be frequent updates to TableTools (or 2.0 will appear soon).
There aren't any more planned releases for the TableTools 1.x series - and I'm working on TableTools 2 at the moment (the CSS aspect of it actually). I really hope to have TableTools 2 released soon-ish, it's primarily a case of finishing off the API and then writing the documentation... If you fancy a beta copy, you can ping me with the form here: http://datatables.net/contact :-)
Allan