koalyptus / TableFilter

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

TableFilter constructor breaks when "id" parameter contains a period #798

Open ghost opened 3 years ago

ghost commented 3 years ago

Describe the bug When the string id parameter is used in the TableFilter constructor and that id string contains a period, the column filters do not contain any values from the corresponding column.

Reproduction steps: Steps to reproduce the behavior:

  1. Create a table with an id that has a period
  2. Call the TableFilter constructor with a string of that id

See these contrasting examples: https://codepen.io/gerrycampion/pen/NWRyQxY

Expected behavior The column filters should still be populated with the column values even when the table id contains a period.

Observed behavior: The column filters do not contain any values from the corresponding column.

TableFilter version: 0.7.3 Browser and version: Google Chrome Version 87.0.4280.88 (Official Build) (64-bit) OS and version: Microsoft Windows 10 Pro x64 Version 10.0.19041 Build 19041 Device: PC

koalyptus commented 3 years ago

Hi @gerrycampion,

Many thanks for reporting this bug, if you need a quick workaround while waiting for the fix, based on the 2nd table in your codepen, replace the configuration with this

var tf1 = new TableFilter("broken.table", {
  col_0: "checklist",
  col_1: "multiple",
  col_2: "select"
})
tf1.id = "broken\\.table"
tf1.init();

The id needs to be escaped... the culprit being a slack querySelectorAll usage here: https://github.com/koalyptus/TableFilter/blob/7afe45f1e6d46ef97ea20ac47bc4ee961b5d231f/src/tablefilter.js#L2108

Cheers