Search code examples
jquerydjangotablesorter

Tablesorter not loading in Django


Tablesorter doesn’t work for my Django-based website. Clicking on the table header doesn’t do anything, and I didn’t see any error message either. The console error message for jquery.tablesorter displays only:

Uncaught SyntaxError: Unexpected token <    jquery.tablesorter.js:1 

I feel like something simple was missing… The JS plugins were invoked with:

{% load static %}
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.js"></script>
<table id="myTable" class="tablesorter">
<thead>…</thead>
<tbody>…</tbody>
…
<script>
$(document).ready(function(){
        $('#myTable').tablesorter({sortList: [[0,0], [1,0]]});
    }
);
</script>

The JS files are in a static folder with the following structure:

myvenv
mysite
    |---- db.sqlite3
    |---- manage.py
    |---- blog
            |---- management
            |---- migrations
            |---- templates
            |---- templatetags
            |---- admin.py
            |---- models.py
            |---- urls.py
            |---- views.py
    |---- static
            |---- js
                  |---- jquery.js
                  |---- jquery.tablesorter.js
                  |---- …
    |---- mysite

Solution

  • NVM, I need to specify the path for STATICFILES_DIRS when testing locally, everything is working fine now