Data not loading in my Django Select2 options

I have a project that I am working in my Django Project I want data to be loaded from my DB to my select option. When an LCDA (Name of Local District in my app) is selected zones belonging to that LCDA will display on another select element if a Zone is selected Areas belonging to that zone will also display more like having three select element in my form.
The issue is no data is being displayed on the three element and worst still when I inspect on my browser I am not seeing the CSS links and JS links, I am using Django 3.0 but this same thing worked on Django2.1, could this be a Django version issue? If it is, I can’t afford to downgrade my app to 2.1 I followded this steps

  1. pip install django_select2
  2. I added django_select2 to my installed apps
  3. I added to my url config path(‘select2/’, include(‘django_select2.urls’)),
  4. I added this in my head {{ form.media.css }} on my base.html
  5. I aded jquery before body on my base.html
  6. I added this before body {{ form.media.js }} on my base.html

my models.py
class User(AbstractBaseUser, PermissionsMixin):

    member_id = models.CharField(_('Member Id'), max_length=14, unique=True)

    email = models.EmailField(_('Email Address'))

    phone1 = models.CharField(_('Phone Number 1'), max_length=16)

    phone2 = models.CharField(_('Phone Number 2'), max_length=16, blank=True)

    first_name = models.CharField(_('First name'), max_length=30, blank=True)

    last_name = models.CharField(_('Last name'), max_length=30, blank=True)

    date_joined = models.DateTimeField(_('Date joined'), auto_now_add=True)

    is_active = models.BooleanField(_('active'), default=True)

    user_type = models.CharField(max_length=30, choices=options.USER_TYPE, default=options.CHOOSE)

class LCDA(models.Model):

    name = models.CharField(max_length=50)

    def __str__(self):

        return self.name

    def get_absolute_url(self):

        return reverse('backend:detail_lcda', kwargs={'pk': self.id})


class ZonalID(models.Model):

    zone_name = models.CharField(max_length=50)

    zone_code = models.CharField(max_length=2)

    lcda = models.ForeignKey(LCDA, on_delete=models.CASCADE, blank=True, null=True)

    def __str__(self):

        return self.area_name

    

    def get_absolute_url(self):

        return reverse('backend:detail_zone', kwargs={'pk': self.id})

class AreaID(models.Model):

    area_name = models.CharField(max_length=30)

    area_code = models.CharField(max_length=2)

    zonal_id = models.ForeignKey(ZonalID, on_delete=models.CASCADE)

    def __str__(self):

        return self.area_name

forms.py

    from django import forms

    from django.core import validators

    from .models import(

        AdditionalProfile, 

        User, PropertyModel,

        LCDA, ZonalID, AreaID

    )

    from . import options

    from django_select2 import forms as s2forms

class AddExco(UserCreationForm):

    member_id = forms.CharField(label='Memebr Id*', widget=forms.TextInput(attrs={'class':'form-control', 'placeholder':'Member Id'}))

    password1 = forms.CharField(label='Enter Password*', widget=forms.PasswordInput(attrs={'class':'form-control', 'placeholder':'Enter Password'}))

    password2 = forms.CharField(label='Confirm Password*', widget=forms.PasswordInput(attrs={'class':'form-control', 'placeholder':'Confirm Password'}))

    email = forms.CharField(label='Email*', widget=forms.EmailInput(attrs={'class':'form-control', 'placeholder':'Email'}))

    first_name = forms.CharField(widget=forms.TextInput(attrs={'class':'form-control', 'placeholder':'Firstname'}))

    last_name = forms.CharField(widget=forms.TextInput(attrs={'class':'form-control', 'placeholder':'Lastname'}))

    phone1 = forms.CharField(label='Phone Number 1*', widget=forms.TextInput(attrs={'class':'form-control', 'placeholder':'Phone Number 1'}))

    phone2 = forms.CharField(label='Phone Number 2', required=False, widget=forms.TextInput(attrs={'class':'form-control', 'placeholder':'Phone Number 2'}))

    user_type = forms.CharField(label='User Type*', widget=forms.Select(choices=options.USER_TYPE, attrs={'class':'form-control'}))

    botcatcher = forms.CharField(required=False, widget=forms.HiddenInput, validators=[validators.MaxLengthValidator(0)])

    lcda = forms.ModelChoiceField(

        queryset=LCDA.objects.all(),

        label=u"LCDA*",

        widget=s2forms.ModelSelect2Widget(

            attrs={'class':'form-control'},

            model=LCDA,

            search_fields=['name__icontains'],

        )

    )

    zonal = forms.ModelChoiceField(

        queryset=ZonalID.objects.all(),

        label=u"Zonal*",

        widget=s2forms.ModelSelect2Widget(

            attrs={'class':'form-control'},

            model=ZonalID,

            search_fields=['name__icontains'],

            dependent_fields={'lcda': 'lcda'},

            max_results=100,

        )

    )

    area = forms.ModelChoiceField(

        queryset=AreaID.objects.all(),

        label=u"Area*",

        widget=s2forms.ModelSelect2Widget(

            attrs={'class':'form-control'},

            model=AreaID,

            search_fields=['name__icontains'],

            dependent_fields={'zonalid': 'zonalid'},

            max_results=100,

        )

    )

    class Meta():

        model = User

        exclude = ('date_joined', 'is_active', 'password', 'last_login', 'is_superuser', 'groups', 'user_permissions')

    def save(self, commit=True):

        user = super().save(commit=False)

        user.member_id = self.cleaned_data['member_id']

        user.first_name = self.cleaned_data['first_name']

        user.last_name = self.cleaned_data['last_name']

        user.email = self.cleaned_data['email']

        user.phone1 = self.cleaned_data['phone1']

        user.phone2 = self.cleaned_data['phone2']

        user.user_type = self.cleaned_data['user_type']

        if commit:

            user.save()

            return user

views.py
@login_required(login_url=’/backoffice/’)

def add_exco(request):

    if request.method == 'POST':

        register_form = AddExco(request.POST)

        if register_form.is_valid():

            register_form.save()

            messages.success(request, 'An Exco have been registered successfully')

            return redirect('backend:add_exco')

            register_form = RegisterForm()

    else:

        register_form = AddExco()

    return render(request, 'dashboard/add-exco.html', {'reg':register_form})

on my template
{% extends ‘dashboard/base.html’ %}

{% block title %}

Add Executive

{% endblock %}

{% block content %}

<div class="row">

    <div class="col-lg-12 grid-margin stretch-card">

      <div class="card">

        <div class="card-body">

            <h2>Add Executive</h2>

            <form method='POST'>

              {% include 'dashboard/two-column-form.html' with form=reg %}

              <input type="submit" class="btn btn-primary btn-block" value="Save">

            </form>

            

        </div>

      </div>

    </div>

</div>

{% endblock %}