Show/Hide issue when the header has a blank Value

gvssk61

When a header has a blank name at the end, the column name in the show/hide shows as a very tiny bar. Can this be expanded? Pl see the enclosed docx (field after the "F" header).

kthorngren

The word doc just has some garbage in it. I'm guessing you are using the column visibility button. If so, this example shows how to modify the text shown for the columns.

Kevin

gvssk61

We are using this :
$("##example").DataTable({
"dom": '<BRCTlfr><t><ip><"clear">',
"buttons": [ {"extend": "colvis", "align": "right", "text": "Show / Hide Columns","activate": "mouseover" }
In the example given, imagine there is a column next to "Salary" without any header text. The Visibility (in our case we named in Show/Hide) is showing all the 7 but the 7th one, as there is no header text, is not maintaining the same height as other fields. We are seeing just a line instead of a box.

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

kthorngren

The example I linked shows how to modify the text shown. It loops through all the columns. You can check the title parameter to see if blank and return what you want to display for a blank column or just return the title. Have you tried it? As Colin said if you still need help please provide a test case.

Kevin

gvssk61

Thanks Friends. We found a solution. Added a min height property to the button.

div.dt-button-collection button.dt-button, div.dt-button-collection div.dt-button, div.dt-button-collection a.dt-button {
min-height: 25px;