laden mehr Feature oder endlose Seitennummerierung

Question

Ich habe kürzlich gelernt, ich brauche Paginierung sonst Seite wird nicht schneller laden. also habe ich es implementiert. Aber jetzt, da ich fertig implementiert habe, merke ich, dass ich ein Problem habe. My Web ein Format wie dies

hat, ist die über den oberen Teil der Seite

und die oben ist der unter Teil der Seite.

alle meine Posts gehen in den unteren Teil, und weil mehr Posts ich schreibe mehr Posts dort werde ich implementiert Seitennummerierung.

die Paginierung funktioniert gut, aber wenn ich auf die nächste Seite gehe bleibt der obere Teil dort, während der untere Teil neue Beiträge zeigt. (Ich habe dies implementiert, ohne die Existenz des oberen Teils zu erkennen.) Ich möchte nicht, dass meine Benutzer den oberen Teil jedes Mal sehen, wenn sie auf die nächste Seite klicken.

Ich denke, ich habe zwei Möglichkeiten, um dieses Problem zu lösen. Einer ist irgendwie nicht den oberen Teil zu zeigen, wenn sie auf die nächste Seite klicken.

Oder Ich benutze die Schaltfläche mehr laden, um mehr Beiträge anzuzeigen, anstatt in eine andere Seite zu gehen.

Problem ist, ich weiß nicht, wie man einen von ihnen tut .. kann jemand bitte mir helfen?

def category_detail(request, slug): 

    obj = NewsCategory.objects.get(slug=slug) 
    newsInCat = obj.news_set.all() #for the list of news 
    paginator = Paginator(newsInCat, 25) # Show 25 contacts per page 
    page = request.GET.get('page') 
    try: 
     news_set = paginator.page(page) 
    except PageNotAnInteger: 
     # If page is not an integer, deliver first page. 
     news_set = paginator.page(1) 
    except EmptyPage: 
     # If page is out of range (e.g. 9999), deliver last page of results. 
     news_set = paginator.page(paginator.num_pages) 

    bestInCat = obj.news_set.get_bestInCat() 


    context = { 
     "obj":obj, 
     "news_set":news_set, 
     "newsInCat":newsInCat, 
     "bestInCat":bestInCat, 

    } 
    return render(request, "news/category_detail.html", context)  



<div class="row"> 
<div> 
{% for news in news_set %} 
    <div class='col-sm-4'> 

    <div class="content"> 
    <figure class="story-image"> 
     <a href='{{news.get_absolute_url }}'><img src="{{news.get_image_url}}" class="img-rounded" alt="Cinque Terre" width="360" height="267"></a> 
    </figure> 
     <div id="forever "style="margin-bottom:30px;"> 
     <a href='{{news.get_absolute_url }}' style="text-decoration:none; color:#282E5C;"><h4 style="font-size: 18px; 
    font-weight: 400;">{{news.title}}</h4></a> 
    </div> 
     </div> 
    </div> 
    {% endfor %} 
</div> 
</div> 


<div class="pagination"> 
    <span class="step-links"> 
     <!-- {% if news_set.has_previous %} 
      <a href="?page={{ news_set.previous_page_number }}">previous</a> 
     {% endif %} 

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

     {% if news_set.has_next %} 
      <a href="?page={{ news_set.next_page_number }}">Load More</a> 
     {% endif %} 
    </span> 
</div> 

Answer 1

1) in den HTML-Code können Sie Top-Block zeigen, wenn Seitenzahl gleich 1 ist zum Beispiel

{% if news_set.number==1%} 
    {{ top_block}} 
{% endif %} 
<div class="row"> 
<div> 
{% for news in news_set %} 
    <div class='col-sm-4'> .... 

2) Sie Teil html machen kann, wenn Anfrage Ajax ist

Hier einfach

Code

views.py

def category_detail(request, slug): 
    obj = NewsCategory.objects.get(slug=slug) 
    newsInCat = obj.news_set.all() #for the list of news 
    paginator = Paginator(newsInCat, 25) # Show 25 contacts per page 
    page = request.GET.get('page') 
    try: 
     news_set = paginator.page(page) 
    except PageNotAnInteger: 
     # If page is not an integer, deliver first page. 
     news_set = paginator.page(1) 
    except EmptyPage: 
     # If page is out of range (e.g. 9999), deliver last page of results. 
      news_set = paginator.page(paginator.num_pages) 
    if request.is_ajax(): 
     context = { 
      'news_set':news_set 
     } 
     return render(request,"news/category_detail_ajax.html",context) 
    else: 
     bestInCat = obj.news_set.get_bestInCat() 
     context = { 
      "obj":obj, 
      "news_set":news_set, 
      "newsInCat":newsInCat, 
      "bestInCat":bestInCat, 
     } 
     return render(request, "news/category_detail.html", context)  

category_detail_ajax.html

{% for news in news_set %} 
    <div class='col-sm-4'> 

    <div class="content"> 
    <figure class="story-image"> 
     <a href='{{news.get_absolute_url }}'><img src="{{news.get_image_url}}" class="img-rounded" alt="Cinque Terre" width="360" height="267"></a> 
    </figure> 
     <div id="forever "style="margin-bottom:30px;"> 
     <a href='{{news.get_absolute_url }}' style="text-decoration:none; color:#282E5C;"><h4 style="font-size: 18px; 
    font-weight: 400;">{{news.title}}</h4></a> 
    </div> 
     </div> 
    </div> 
    {% endfor %} 

Javascript

jQuery(document).on('click','.load-more',function(e){ 
    e.preventDefault(); 
    jQuery.ajax({ 
     url:jQuery(this).attr('href') 
    }).done(function(data){ 
     jQuery('.row>div').append(data); 
    }); 
});