search

jerrylow / basictable

Basic Table jQuery or Vanilla JS plugin for simple responsive tables.
MIT License
127 stars 57 forks source link

First column header throws error #15

Open Vertigrator opened 3 years ago

Vertigrator commented 3 years ago

When the first column of the table is set as a header it throws this error: Uncaught TypeError: can't access property "text", a[e][t] is undefined

Example table below: <table class="ms-rteTable-5" width="100%" cellspacing="0"><tbody><tr class="ms-rteTableEvenRow-5"><th class="ms-rteTableFirstCol-5" rowspan="1" colspan="1" style="width:16.6667%;" data-th="​Wast​e (Tonnes): ​2011-12: ​2012-13: ​2013-14: ​2014-15"><span class="bt-content">​Wast​e (Tonnes)<br></span></th><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1" style="width:16.6667%;">​Landfilled</td><td class="ms-rteTableEvenCol-5" rowspan="1" colspan="1" style="width:16.6667%;">​Recycled</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1" style="width:16.6667%;">​Composted</td><td class="ms-rteTableEvenCol-5" rowspan="1" colspan="1" style="width:16.6667%;">​Generated</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1" style="width:16.6667%;">​Recovered</td></tr><tr class="ms-rteTableOddRow-5"><th class="ms-rteTableFirstCol-5" rowspan="1" colspan="1">​2011-12</th><td class="ms-rteTableOddCol-5">​460,467</td><td class="ms-rteTableEvenCol-5">​159,633</td><td class="ms-rteTableOddCol-5">​41,298</td><td class="ms-rteTableEvenCol-5">​661,398</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1">​30.4%</td></tr><tr class="ms-rteTableEvenRow-5"><th class="ms-rteTableFirstCol-5" rowspan="1" colspan="1">​2012-13</th><td class="ms-rteTableOddCol-5">​471,921</td><td class="ms-rteTableEvenCol-5">​182,193</td><td class="ms-rteTableOddCol-5">​41,748</td><td class="ms-rteTableEvenCol-5">​696,861</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1">​32.3%</td></tr><tr class="ms-rteTableOddRow-5"><th class="ms-rteTableFirstCol-5" rowspan="1" colspan="1">​2013-14</th><td class="ms-rteTableOddCol-5">​398,603</td><td class="ms-rteTableEvenCol-5">​200​​,380<br></td><td class="ms-rteTableOddCol-5">​37,642</td><td class="ms-rteTableEvenCol-5">​636,625</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1">​37.4%</td></tr><tr class="ms-rteTableEvenRow-5"><th class="ms-rteTableFirstCol-5" rowspan="1" colspan="1">​2014-15</th><td class="ms-rteTableOddCol-5" rowspan="1">​415,443</td><td class="ms-rteTableEvenCol-5" rowspan="1">​194,170</td><td class="ms-rteTableOddCol-5" rowspan="1">​39,350</td><td class="ms-rteTableEvenCol-5" rowspan="1">​648,964</td><td class="ms-rteTableOddCol-5" rowspan="1" colspan="1">​36.0%</td></tr></tbody></table>

jerrylow commented 3 years ago

Ah I see the issue here. You have an unfortunately there's no support for column headers yet as a duplicate with #10. Open for a PR but I haven't had time to get around to this. The structure I'm eying to support will be https://www.w3.org/WAI/tutorials/tables/two-headers/

Vertigrator commented 3 years ago

We have made the decision to avoid having tables with column headers as a workaround. But it would be nice if this support was added at some point.

Vertigrator commented 3 years ago

If there is a way you can catch the error with a try/catch then at least other Javascript on the page would continue to run, even if the table can't be made responsive.