[Answer]-Data Pagination on the same page

1👍

Ok, auto-solved ; modification must be the following:

prodList.html

{% for prod in products %}
    <span id="prod-id-{{ prod.id }}">{{ prod.id }}</span>
    <span id="prod-name-{{ prod.id }}">{{ prod.file_name }}</span></br>
{% endfor %}

<div class="pagination">
    <span class="step-links">
        {% if products.has_previous %}
            <button onclick="getPage({{ products.previous_page_number }})">previous</button>
        {% endif %}

        <span class="current">
            Page {{ products.number }} of {{ products.paginator.num_pages }}.
        </span>

        {% if products.has_next %}
            <button onclick="getPage({{ products.next_page_number }})">next</button>
        {% endif %}
    </span>
</div>

utils.js

$(document).ready(function(){
    $("#searchBut").click(function(){

        if($("#fromDatePicker").val() == "")
            $("#fromDatePicker").datepicker("setDate", minDate);

        if($("#toDatePicker").val() == "")
            $("#toDatePicker").datepicker("setDate", maxDate);

        var request = $.ajax({
            type: "get",
            url: "getGomosProducts",
            data:{
                'startDate': $("#fromDatePicker").val(),
                'stopDate': $("#toDatePicker").val()
            }
        });
        request.done(function(prodList){
            $("#prodList").html(prodList);
        });
    });
});

function getPage(page){
    var request = $.ajax({
        type: "get",
        url: "getGomosProducts",
        data:{
            'startDate': $("#fromDatePicker").val(),
            'stopDate': $("#toDatePicker").val(),
            'page': page
        }
    });

    request.done(function(prodList){
        $("#prodList").html(prodList);
    });
}
👤caneta

Leave a comment