CODEWITHSUNDEEP
djangodjango-templates
Jasper
Jasper

Reputation: 2231

Django: Deleting query filters with button in template

I have a listview that displays a list of objects ('Speakers') that has a simple filter on top.

In the template I've put the following code

      <form class="col-md-5" method="get">
            <div class="input-group">

                <select name="type" class="selectpicker" multiple>
                    {% for type in types %}
                    <option><a href="#">{{ type.name }}</a></option>
                    {% endfor %}
                </select>    

            <span class="input-group-btn"><button class="btn btn-gray" type="submit">Search</button></span>
            </div>
        </form>

The types are supplied by the 'get_context_data' method from the listview, like so

def get_context_data(self, **kwargs):
    data = super(SpeakerList, self).get_context_data(**kwargs)
    typelist = [x for x in Type.objects.all()]
    data['types'] = typelist
    return data

The filters are handles in the 'get_queryset' method like so

def get_queryset(self, **kwargs):
        qs = super(SpeakerList,self).get_queryset().filter(status=STATE_ACTIVE)
        types = self.request.GET.getlist('type', None)
        categories = self.request.GET.getlist('category', None)

        if types:
            qs = qs.filter(type__in=types)
        if categories:
            qs = categories.filter(categories__in=categories)

        return qs

So far, so good. However, I want to display all of the selected filters in the template, with a 'remove' button behind them so users can remove specific filters. The template would then look something like this

[ Type select dropdown ] .

[ Day-speaker 'X'] . [Weekend-speaker 'X']

Object list

Supplying the filters that are used is easy, I've added the following code to the get_context_data

types_query = self.request.GET.getlist('type', None)
data['types_query']

and used the following code in my template:

{% if types_query %}
    <p>You used the following 'type' filters:</p>

    {% for type in types_query %}
        <p>{{ type }} <button>Remove</button> </p>
    {% endfor %}
{% endif %}

However, I am not sure how to proceed from here. The list is rendered as it should, but I do not know how to make the 'remove filter' . functionality work.

If I enclose the code above in a form and make it post, it will clear the entire queryset. Yet if I dont the form wont have access to the currently selected filters.

I've seen functionality like this on many websites, so I know it should be possible. Does anyone here know what I am doing wrong?

Upvotes: 0

Views: 1215

Answers (1)

kevswanberg
kevswanberg

Reputation: 2109

Anchor with an href the same page with that query parameter removed.

{% for type in types_query %}
    <p>{{ type }} <a href="{{ url_with_type_removed }}">Remove</a> </p>
{% endfor %}

You would need to do some processing inside the view to come up with what the URL should look like. This answer can help you there.

Upvotes: 2

Related Questions