Django - Reset all filters

I am trying to clear all filters on button click at once. This is what I have on filters.py file and filters class:

class Filters(django_filters.FilterSet):
    id = django_filters.NumberFilter(label=_("ID"))
    name = django_filters.TextFilter(label=_("Name"))

And in base template:

        <form id="filters-filters-form" action="javascript:;" onsubmit="onSubmit(this)" class="form form-inline main-filter">
            {% bootstrap_form filter.form layout='inline' %}
            <div>
                <button class="btn ml-auto mr-2" onclick="resetFilters()">Clear all</button>
                {% trans "Apply" as button_text %}
                {% bootstrap_button button_text button_class="btn-primary" %}
            </div>
        </form>

resetFilters() function:

var resetFilters = function() {
    let formId = document.getElementById('filters-form')
    let formChildren = formId.childNodes;
    Array.from(formChildren).forEach(formChild => {
        formChild.val(null).trigger('change')
    });
}

Is there any easy way to reset all filters?

P.S: I need to reset these filters without any id of form-control because it will be reusable base template

you can just add a button and add the URL of your form :

<a class="btn ml-auto mr-2" href={<pass your URL here>} > Clear All </a>
Back to Top