{{minMaxPrice.price__min}}-{{minMaxPrice.price__max}} [closed]

Learning Django and now creating price filter. When min and max price is statick, all good, when chenging filter to dinamic, nothin working.

Static range from 0 to 1000 working:

filter.html

    {% load static %}
    <script type="text/javascript" src="{% static 'product-filter.js' %}"></script>
                <h3 class="mb-4 border-bottom pb-1">Фильтры</h3>
                <!-- Price Filter -->
                <div class="card mb-4">
                    <h6 class="card-header">Цена</h6>
                    <div class="list-group list-group-flush">
                        <li class="list-group-item">
                            <input type="range" id="rangeInput" min={{minMaxPrice.price__min}} max={{minMaxPrice.price__max}} oninput="maxPrice.value=this.value" />
                            <p>{{minMaxPrice.price__min}}-{{minMaxPrice.price__max}}</p>
                        </li>
                        <li class="list-group-item">
                            Максимальная цена: <input type="number" onkeyup="rangeInput.value=this.value" id="maxPrice" min={{minMaxPrice.price__min}} max={{minMaxPrice.price__max}} />
                        </li>
                    </div>
                </div>
                <!-- Filter 1 -->
                <div class="card mb-4">
                    <h6 class="card-header">Категории</h6>
                    <div class="list-group list-group-flush">
                        {% for cat in cats %}
                        <li class="list-group-item">
                            <input class="filter-checkbox" data-filter="category" value="{{cat.category__id}}" type="checkbox" />&nbsp;
                            {{cat.category__title}}
                        </li>
                        {% endfor %}
                    </div>
                </div>

template_context.py

    from .models import Product
    from django.db.models import Min, Max
    from django.db.models import FloatField


    def get_filters(request):
        cats = Product.objects.distinct().values('category__title', 'category__id')
        minMaxPrice = Product.objects.aggregate(Min('price', output_field=FloatField()), Max('price', output_field=FloatField()))
        data = {
            'cats': cats,
            'minMaxPrice': minMaxPrice,
        }
        return data

It's showing filter from 0 to 1000 and showing title range from my prices.

Static range from 0 to 1000

Dinamic range not working:

filter.html

{% load static %}
<script type="text/javascript" src="{% static 'product-filter.js' %}"></script>
        <h3 class="mb-4 border-bottom pb-1">Фильтры</h3>
        <!-- Price Filter -->
        <div class="card mb-4">
            <h6 class="card-header">Цена</h6>
            <div class="list-group list-group-flush">
                <li class="list-group-item">
                    <input type="range" id="rangeInput" min={{minMaxPrice.price__min}} max={{minMaxPrice.price__max}} oninput="maxPrice.value=this.value" />
                    <p>{{minMaxPrice.price__min}}-{{minMaxPrice.price__max}}</p>
                </li>
                <li class="list-group-item">
                    Максимальная цена: <input type="number" onkeyup="rangeInput.value=this.value" id="maxPrice" min={{minMaxPrice.price__min}} max={{minMaxPrice.price__max}} />
                </li>
            </div>
        </div>
        <!-- Filter 1 -->
        <div class="card mb-4">
            <h6 class="card-header">Категории</h6>
            <div class="list-group list-group-flush">
                {% for cat in cats %}
                <li class="list-group-item">
                    <input class="filter-checkbox" data-filter="category" value="{{cat.category__id}}" type="checkbox" />&nbsp;
                    {{cat.category__title}}
                </li>
                {% endfor %}
            </div>
        </div>

Dinamic filter

Dinamic filter showing range from 0 to 100 like a percents, but title range from my prices still looking good. Can somebody help me and say, what am I doing wrong?

I tried to search for information on price filtering, but the code looks correct.

Back to Top