django autocomplete light Uncaught TypeError: $ is not a function - django-autocomplete-light

Question

I'm using django-autocomplete-light==3.8.1 with Django==3.0.6.
I've used it in older versions of django and it worked but with the new version I am getting this javascript error $ is not a function
Here is my setting:
INSTALLED_APPS = [
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'dal',
'dal_select2',
'myapp',
'django.contrib.admin',
'django_extensions',
]
and my models.py
from django.db import models
class IP(models.Model):
ip_address = models.CharField(max_length=15, db_index=True, unique=True)
def __str__(self):
return self.ip_address
class Account(models.Model):
uid = models.PositiveIntegerField(db_index=True, unique=True)
name = models.CharField(max_length=15, db_index=True, unique=True)
ip = models.ForeignKey(IP, null=True, blank=True, on_delete=models.CASCADE)
def __str__(self):
return self.name
and my admin:
from django.contrib import admin
from dal import autocomplete
from .models import *
#admin.register(Account)
class AccountAdmin(admin.ModelAdmin):
list_display = ('name', 'ip')
form = AccountForm
#admin.register(IP)
class IPAdmin(admin.ModelAdmin):
list_display = ('ip_address',)
class AccountForm(autocomplete.FutureModelForm):
class Meta:
model = Account
fields = ('__all__')
widgets = {
'ip': autocomplete.ModelSelect2(url='ip-autocomplete'),
}
it is strange that it does not find jquery.
Here is what I see in the admin html page:
<script type="text/javascript" src="/admin/jsi18n/"></script>
<link href="/static/admin/css/vendor/select2/select2.css" type="text/css" media="screen" rel="stylesheet">
<link href="/static/admin/css/autocomplete.css" type="text/css" media="screen" rel="stylesheet">
<link href="/static/autocomplete_light/select2.css" type="text/css" media="screen" rel="stylesheet">
<script type="text/javascript" src="/static/admin/js/vendor/jquery/jquery.js"></script>
<script type="text/javascript" src="/static/admin/js/vendor/select2/select2.full.js"></script>
<script type="text/javascript" src="/static/admin/js/jquery.init.js"></script>
<script type="text/javascript" src="/static/autocomplete_light/autocomplete_light.js"></script>
<script type="text/javascript" src="/static/admin/js/core.js"></script>
<script type="text/javascript" src="/static/autocomplete_light/select2.js"></script>
<script type="text/javascript" src="/static/admin/js/admin/RelatedObjectLookups.js"></script>
<script type="text/javascript" src="/static/autocomplete_light/i18n/en.js"></script>
<script type="text/javascript" src="/static/admin/js/actions.js"></script>
<script type="text/javascript" src="/static/admin/js/urlify.js"></script>
<script type="text/javascript" src="/static/admin/js/prepopulate.js"></script>
any ideas what I need to do to make django-autocomplete-light work inside admin page?

Answer 1

It was very strange. After trying many things, including deleting all the static files and running collectstatic again, I realized that if I clear my browser cache, the problem goes away.