Embedding jquery.tablesorter.widgets.js in HTML

Question

I am trying to embed a jquery.tablesorter.widgets.js script in an HTML file so that I can have one HTML file for sharing sortable / filtered data with others. In particular, I use a filter widget.

Link: https://mottie.imtqy.com/tablesorter/js/jquery.tablesorter.widgets.js

Problem. Filtering does not work when embedding the above code in my HTML. The script is executed, since I have the ability to enter text to filter, but the actual filtering is not performed. It seems that the results are being produced dynamically.

Embedding jquery and base tablesorter script (for sorting) works as desired.

Am I trying to do this?

thanks

EDIT: Initializing the code below

<script>
    $(function(){
  $('table').tablesorter({
 theme:'blue',
    widgets: [ 'zebra', 'resizable', 'stickyHeaders', 'filter' ],
    widgetOptions: {
      resizable: true,
      resizable_widths : [ '15%', '15%', '10px', ],
      resizable_targetLast : false,
      filter_cssFilter   : '',
      filter_childRows   : false,
      filter_hideFilters : false,
      filter_searchDelay : 300,
      filter_startsWith  : false,
      filter_external : '.search',
      filter_columnFilters: true,
      filter_placeholder: { search : 'Filter...' },
      filter_saveFilters : true,
      filter_reset: '.reset',
      }
      });
});
    </script>

Answer 1

jquery.tablesorter.widgets.js . tablesorter, .

, "" : https://mottie.imtqy.com/tablesorter/js/jquery.tablesorter.combined.js

"" :

• jquery.tablesorter.js:
  • tablesorter.
  • zebra.
• jquery.tablesorter.widgets.js:
  • uitheme
  • stickyHeaders

, , npm, grunt json . jquery.tablesorter.js , , .