Reputation: 209
I know there a lot of postings about hiding columns but I would add another question. Below is a snippet from php-generated html:
<table id="dataGrid">
<col style="display:none">
<col style="display:table-column">
<col style="display:table-column">
<col style="display:table-column">
<col style="display:table-column">
<col style="display:table-column">
<col style="display:table-column">
<col style="display:table-column">
<thead><tr>
...
This doesn't work at all. Is there an effective way to hide a column via html/css, without using a myriad of td's? w3.org implies that there is, but I have tried visibility, hidden, collapse table cells, and so on - with no result.
I don't want to set a class for each in huge table, so jquery is out of the question.
Upvotes: 0
Views: 7922
Reputation: 1548
I would do it this way. This will hide the "Second Title" column, or middle column. You could also replace style="display:none"
with a variable like this style="<?php echo $nodisplay;?>"
Then you could turn columns off or on depending on your data. For instance $nodisplay could be equal to display:none; depending on whether you wish to show the column or not.
<table id="dataGrid">
<thead>
<tr>
<th>First Title</th>
<th style="display:none">Second Title</th>
<th>Third Title</th>
</tr>
</thead>
<tbody>
<tr>
<th>First Body</th>
<th style="display:none">Second Body</th>
<th>Third Body</th>
<tr>
</tbody>
<table>
Upvotes: 0
Reputation: 3446
Try something like this in CSS:
#myTable tr *:nth-child(2), {
display: none;
}
In this case, 2 is the index of the column you want to hide.
I got this from the second answer of this question: How to hide columns in HTML table?
Upvotes: 4