Column and Date Filters Not Appearing

[kianfotovat]

trafficstars

Hello, I am working with Django 5.1/Python 3.13. I am trying to use django-ajax-datatable to implement DataTables and have almost got it set up but am running into trouble with the filters.

I have an AjaxDataTableView that looks like this:

class ClaimAjaxDatatableView(AjaxDatatableView):
    model = Claim
    title = "Claims"
    length_menu = [[10, 20, 50, 100, -1], [10, 20, 50, 100, "all"]]
    search_values_separator = "+"
    debug=True
    show_column_filters = True
    show_date_filters = True

    column_defs = [
        {"name": "ClaimID", "title": "Claim Number", "className": "claim-link", 'visible': True, },  # Add class here
        {"name": "ClaimTypeID", "title": "Claim Type", "choices": True, "autofilter": True, "foreign_field": "ClaimTypeID__Description", 'visible': True, }, #foreign_field
        {"name": "StatusID", "title": "Status", "foreign_field": "StatusID__Description", 'visible': True, },
        {"name": "CreatedOn", "title": "Created On", 'visible': True, },
        {"name": "ModifiedOn", "title": "ModifiedOn", 'visible': True, },
    ]

a simple view to render the page:

@login_required
def claims(request):
        return render(request, "WarrantyApp/technicianclaims.html", { })

and a simple template:

{% extends 'WarrantyApp/base.html' %} 
{% load static %}
{% block title %}WarrantyApp - Claims{% endblock %} 
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h1 class="text-center flex-grow-1 mb-0">Claims List</h1>
    <form action="{% url 'InvoiceSearch' %}" method="post" class="d-inline">
        {% csrf_token %}
        <button type="submit" class="btn btn-primary">New Claim</button>
    </form>
</div>

<div class="table-responsive">
    <table id="datatable_claims" width="100%" class="table table-striped table-bordered compact nowrap">
    </table>
</div>

{% endblock %}

{% block extra_js %}
<script language="javascript">
    $(document).ready(function() {
        AjaxDatatableViewUtils.initialize_table(
            $('#datatable_claims'),
            "{% url 'ajax_datatable_claims' %}",
            {
                autoWidth: false,
            }, {
                // extra_data
            },
        );
    });
</script>
{% endblock %}

From what I can tell, the column-specific search boxes should be visible as well as a "From date" and "To date" but instead all I see is this:

I tried adding the from/to date in the extra_data section (I saw something similar in the documentation) but that gave me an error saying those arguments didn't exist. I verified that the CSS style I'm applying isn't the issue, so I'm not sure what's wrong. Superficially this seems similar to #120 but unfortunately the author didn't update the issue with the solution before closing it.

I'm sure I'm missing something obvious here but I'm lost at this point. Any help would be greatly appreciated, thanks!