模板中的django-filter按钮 [英] django-filter button in template

问题描述

我正在使用django-filter软件包.我的页面显示所有书籍.我有5种体裁.我希望某人能够单击吓人"按钮，并过滤我的图书清单(用户不必也必须单击提交"，而只需单击流派按钮).

I'm using the django-filter package. My page displays all books. I have 5 genres. I want someone to be able to click a "scary" button, and have that filter my book list (user shouldn't have to also click "submit", just the genre button).

但是，当我单击一个流派按钮时，它不会被过滤.除非我在我的filters.py(注释掉)中使用了一个复选框小部件，否则请选中该复选框，然后单击体裁"按钮，但这看起来很难看.

But right now when I click a genre button, it doesn't filter. Unless I use a checkbox widget in my filters.py (commented out), check the box, and then click the genre button, but this looks ugly.

提前感谢您的帮助！

Filters.py

class BookFilter(django_filters.FilterSet):
    genre = django_filters.ModelMultipleChoiceFilter(queryset=Genre.objects.all(),
#widget=CheckboxSelectMultiple)
    class Meta:
        model = Book
        fields = ['genre']

book_list.html

<form method="get">
  <ul>
    {% for genre in filter.form.genre %}
    <li>
      <button type="submit" class="button">
        {{ genre }}
      </button>
    </li>
    {% endfor %}
  </ul>
</form>

更新感谢GwynBleidD的帮助！我还必须将{filter.form.genre％}中流派的％更改为genre_list％}中流派的{％，在我看来，genre_list = Genre.objects.all().否则，按钮的值为value = option value = 10而不是value = 10.

Update Thanks to GwynBleidD for the help! I also had to change {% for genre in filter.form.genre %} to {% for genre in genre_list %} where in my views, genre_list=Genre.objects.all(). Otherwise, the button value was value=option value=10 instead of value=10.

推荐答案

您可以为按钮添加名称和值.单击该方式按钮后，还将在提交表单之前将指定名称的属性设置为指定值

You can add name and value to your button. That way button, when clicked, will also set property of specified name to specified value before submitting your form

<form method="get">
  <ul>
    {% for genre in filter.form.genre %}
    <li>
      <button type="submit" class="button" name="genre" value="{{ genre }}">
        {{ genre }}
      </button>
    </li>
    {% endfor %}
  </ul>
</form>

这篇关于模板中的django-filter按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！