Search code examples
jquerytablesorter

Tablesorter (mottie fork) / theme bootstrap / headers sorter false => i class still exist


My app use jQuery + Tablesorter (mottie fork) to create a server overview table.

I use the Bootstrap theme (theme.bootstrap.css) and in the tablesorter init I add

theme: "bootstrap"

and disable column 0 with

headers: { 0: { 
                           sorter: false, 
                           filter: false
                       }
                  },

It looks good:

view of checkbox in header

but I have a problem to work with the checkbox. I can only activate it in one pixel right down of the header.

I can see, that the icon for sorting will not show, but the <i class ..> is still there.

And this settings overwrite my small header checkbox:

<div class="tablesorter-wrapper" style="position:relative;height:100%;width:100%">
   <div class="tablesorter-header-inner"><input name="Marked" value="0" onclick="CheckTable(this,'chkbox_')" type="checkbox"> 
      <i class="tablesorter-icon"></i>
   </div>
</div>

Where does this <i class ...> come from? What am I doing wrong?

Regards Jochen

Tablesorter v2.26.5 jQuery v2.2.3


Solution

  • That looks like it's a bug in the css. I just added the following css definitions to the bootstrap theme (and a few others)

    .tablesorter-bootstrap .tablesorter-header.sorter-false i.tablesorter-icon {
      display: none;
    }
    .tablesorter-bootstrap .sorter-false .tablesorter-header-inner {
      padding: 4px;
    }
    

    If you add them, or update the theme (not released yet) from the master branch.