0

I work on an older React application that imports jquery table sorter for displaying table to user and allowing of sort / filter. I recently migrated this application from gulp to webpack and now on builds I receive an error that '.tablesorter()' is undefined.

Previously, we used tablesorter like: 

componentDidMount = () => {
    let filterOption = false;
    let widgetOption = ["sortTbody"];
    if (this.props.items.length > 1) {
      filterOption = true;
      widgetOption = ["sortTbody", "filter"];
    }
    $("#sortabletable").tablesorter({
      widgets: widgetOption,
      widgetOptions: {
        sortTbody_primaryRow: ".main",
        sortTbody_sortRows: false,
        sortTbody_noSort: "tablesorter-no-sort-tbody",
        scroller_jumpToHeader: false,
        scroller_upAfterSort: false,
        filter_childRows: filterOption
  }
});

And made sure to import tablesorter library in our index.html like: 

<script type="text/javascript" src="/libs/tablesorter-master/js/jquery.tablesorter.js"></script>
<script type="text/javascript" src="/libs/tablesorter-master/js/jquery.tablesorter.widgets.js"></script>
<script src="/libs/tablesorter-master/js/widgets/widget-sortTbodies.js">

Right now, I dont have time to implement a new table library. How can I go about making this jquery plugin work with modern React? I have read Integrating with Other Libraries but I seem to be unable to get a working solution.

Any ideas are much appreciated.

Improve this question
2
  • You'll have to import the tablesorter in your js files for webpack to be able to work with it.Here is the npm pckg npmjs.com/package/tablesorter. Also take a look at stackoverflow.com/questions/44731221/… Commented Mar 5, 2019 at 20:15
  • I had previously tried importing tablesorter, which actually allowed the code to compile, but sorting did not work (ironically, filtering did). Commented Mar 5, 2019 at 20:31
Related questions
16
JQuery Plugin (datatables) with Webpack and Typescript
1
tablesorter plugin, i am not able to make it work
13
How to make a table in ReactJS sortable?
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.