Search code examples
javascriptjqueryhtml-tabletablesorter

Issue with sorting data-text, failing for colspan cells

Update:

It seems like I have run into the issue of wrong sorting & frozen sortings when I have a cell with the colspan attribute.
See https://jsfiddle.net/2zhjsn31/12/ where it fails for 2018-06-24
On https://jsfiddle.net/2zhjsn31/13/ it works (and silently fails already for 2018-06-10 ).
The examples are now much smaller and should thus be far easier to debug.

I've looked up the issues on github but can't find anything useful. How do I get the colspan cells to work again and not destroy the sorting functionality ?

Old Text:

I have some dynamically generated table which has some font awesome columns. Data is grouped by weeks, so the column types repeat per week. For some reason the sorting fails on some of the font awesome columns and works for others, depending on how many Data I display.

Example:
I Display Week 1,2,3,4 and it works, I display 1,2,3,4,5 and it fails. If I display more or less than 6 Weeks of data, it works, for 6 Weeks it fails.

What I've tried:

  • Used a custom text extractor (initial approach), turned on debugging, printing stuff to console.
  • Created a static site (data not loaded dynamically) and used data-text attributes instead of the custom text extractor.
  • Enabled debug mode, but I didn't find a way to let it log all columns I need. The data I saw was correct.

Current approach:

$('.table').tablesorter({
  widgets: ["stickyHeaders"],
  widgetOptions: {
    stickyHeaders: "fixed-header" // background fix class
  }
});

I'm at a loss, you can see a (mostly) stripped down approach, where sorting by Flags fails for some Weeks and works for others.
At 2018-06-24 it fails horribly as you can see but works for other weeks. enter image description here

https://jsfiddle.net/proc1/h7zy5pxb/

Thanks for any ideas and help.

Solution

  • Problem was answered by Motti in #1577
    I needed to provide the data type specifically, the colspan cells set the data type to digit randomly, rendering some cells without their actual values.

    <th class="sorter-text">Flags</th>