koalyptus / TableFilter

A Javascript library making HTML tables filterable and a bit more :)
https://www.tablefilter.com
MIT License
323 stars 95 forks source link

colspans in tbody rows break auto-generated filter row cells #776

Open stobor827 opened 4 years ago

stobor827 commented 4 years ago

Describe the bug When using an empty config, If the tbody's first or second row contains a cell with colspan, the auto-generated filter row is incorrect

Reproduction steps: Steps to reproduce the behavior: See these examples: https://codepen.io/stobor/pen/oNXdQXQ The first two tables have 'corrupted' filter rows, but not the third.

Expected behavior Colspans in first two rows work just as well as they do in the rest of the table. Maybe that's difficult, I can probably add dummy rows to work around. This issue suggests there's maybe an off-by-one error lingering somewhere though.

TableFilter version: 0.6.109

koalyptus commented 4 years ago

Hi @stobor827, all the TableFilter codepens seem to have an issue at this stage as they return a TableFilter is not defined js exception. Have you tried locally? Please try outside codepen. The demos all work as expected: http://www.tablefilter.com/examples.html

stobor827 commented 4 years ago

Thanks for looking! Yes, I ran into this error locally and used codepen to make it repeatable for this report. The codepen still illustrates the problem for me, here's a screenshot I took today: image

koalyptus commented 4 years ago

Ok, in your scenario you simply need to tell TableFilter what is the reference row from which generate the filters, have a look to the following demo for more info: http://www.tablefilter.com/grouped-headers.html

I have forked your codepen with the expected configurations: https://codepen.io/koalyptus/pen/yLYzXPz

You'll probably notice the configuration for the second table is counter-intuitive and confusing:

var tf1 = new TableFilter('demo1', 0, {
  exclude_rows: [1]
});

It is a workaround, in short before instantiation we tell TableFilter the reference row for filters generation is the headers row at 0 index position. Then after instantiation we instruct to not filter row 1 which are the headers again after filters row is generated so they remain always visible. It should just work with

var tf1 = new TableFilter('demo1', 1);

but unfortunately it is not the case, this is definitely a defect.