I want to wrap a division around the column headers and apply a style that will make it seem like the entire row is connected, I need to insert it in JavaScript as any attempt to do it in the html gets over written
bump, to re-iterate I'm looking for a way to put thead inside a division that I can theme, I've tried to theme the thead but the css display property is set to cell so the UI changes apply to each cell and not the entire row as a singular object
this must be a easy for fix for someone who knows where and how to insert html via javascript in the correct places in the data tables javascript file
So I've tried using jquery to wrap the thead element using .wrap("") in my own css element
it applies the theme but then shunts the first column of the table across the page by the width of the thead element I assume this is because the display attribute is being changed even though I am applying my theme to the parent not the child
I'm not sure I 100% understand what you are looking for - but here is an example showing how you could use a little bit of CSS to create a gap between the table's header and footer: http://live.datatables.net/uximid/edit#javascript,html (note that this is taking advantage of the fact that the table is broken into two when scrolling is enabled).
hello,
maybe pictures will help explain what I mean:
http://d.pr/i/MUbD
the pink border I've added in paint but I basically want to be able to add that in code, now if I apply styling to that row it will create something like this:
http://d.pr/i/SpLd
which is not my intention, or I can apply the border to the entire row but it will expand the width of the first column to width of the entire header, creating a huge shunt
to give you an example of this:
http://d.pr/i/elLm
Replies
this must be a easy for fix for someone who knows where and how to insert html via javascript in the correct places in the data tables javascript file
it applies the theme but then shunts the first column of the table across the page by the width of the thead element I assume this is because the display attribute is being changed even though I am applying my theme to the parent not the child
Allan
maybe pictures will help explain what I mean:
http://d.pr/i/MUbD
the pink border I've added in paint but I basically want to be able to add that in code, now if I apply styling to that row it will create something like this:
http://d.pr/i/SpLd
which is not my intention, or I can apply the border to the entire row but it will expand the width of the first column to width of the entire header, creating a huge shunt
to give you an example of this:
http://d.pr/i/elLm
Allan