B
B
blazer052017-02-28 08:50:54
Django
blazer05, 2017-02-28 08:50:54

How to embed third party jquery paginator?

Good day!
On a site running django, I made a standard pagination, which is styled with bootstrap. By default, the bootstrap paginator is not very suitable. there is a more advanced and at the same time compact jquery paginator . The question is how to implement it on the site, it’s also kind of sharpened for bootstrap, but as soon as I didn’t do anything, it didn’t work out?
This is what I want to display in pagination - the content itself

<div id="comments">
{% for comment in comments %}
<div class="mbr-40"> <blockquote>

<p><b style="border:2px solid #e74c3c;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:10px;color:#e74c3c;padding:0 8px 0 8px">
{{ comment.object }}:</b> {{ comment.text }}
</p></blockquote> </div>
{% endfor %}
</div>

This is a paginator
<div class="row">
    <div class="col-lg-4">
        <ul class="pagination pagination-sm">
            {% if comments.has_previous %}
                <li class="arrow"><a href="{% url 'ajax_commets' %}?page={{ pag }}{{ comments.previous_page_number }}" class="comments-page">&laquo;</a></li>
            {% else %}
                <li class="disabled"><a href="">&laquo;</a></li>
            {% endif %}
            {% for pag in comments.paginator.page_range %}
                {% if pag == comments.number %}
                    <li class="active"><a href="{% url 'ajax_commets' %}?page={{ pag }}" class="comments-page">{{ pag }}</a></li>
                {% else %}
                    <li><a href="{% url 'ajax_commets' %}?page={{ pag }}" class="comments-page">{{ pag }}</a></li>
                {% endif %}
            {% endfor %}
            {% if comments.has_next %}
                <li class="arrow"><a href="{% url 'ajax_commets' %}?page={{ pag }}{{ comments.next_page_number }}" class="comments-page">&raquo;</a></li>
            {% else %}
                <li class="disabled"><a href="">&raquo;</a></li>
            {% endif %}
        </ul>
    </div>
</div>

This is the jquery code that displays pagination without reloading the page
$(document).ready(function () {

       // Посилання з id="test" буде тригером події

       $(".comments-page").click(function(event) {
           event.preventDefault();
           var url = $(this).attr('href');

           // AJAX-запит на потрібну адресу

           $.get(url, function(data) {

               // Замінюємо текст тегу з id="target" на отримані дані

               $("#comments").html(data);

           });

       });

   });

In general, how to replace the standard paginator with the one at the link?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Sama Samsonov, 2017-02-28
@samuser

Views, models and urls write, I'll try to fix it myself?

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question