1

I am tried but i am not getting the desired output for lazy loading

views.py

def post_detail(request, pk):
    post = get_object_or_404(Post, pk=pk)
    content_type = ContentType.objects.get_for_model(Post)
    obj_id = post.id
    comments = Comment.objects.filter(
    content_type=content_type, object_id=obj_id)
    parent_id = request.POST.get("parent_id")
    csubmit = False
    if parent_id:
        content_type = ContentType.objects.get_for_model(Comment)
        Comment.objects.create(content_type=content_type, 
        object_id=parent_id,
                           parent_id=parent_id,
                           user=request.user,
                           text=request.POST.get("text"))
    if request.method == 'POST':
        form = CommentForm(data=request.POST)
        if form.is_valid():
        new_comment = form.save(commit=False)
        new_comment.content_type = content_type
        new_comment.user = request.user
        new_comment.save()
        csubmit = True
    else:
        form = CommentForm()

    paginator = Paginator(comments, 10)
    try:
        comments = paginator.page(page)
    except PageNotAnInteger:
        comments = paginator.page(1)
    except EmptyPage:
        comments = paginator.page(paginator.num_pages)

    return render(request, 'post_detail.html', {'post': post, 
    'comments': comments, 'csubmit': csubmit, 'form': form})

I want to apply lazy loading in the above view and want to apply on template.Above i added pagination and rendered in template

post_details.html

 {%for comment in comments %}
     <br>
 {{comment.text}}<br/>
    by {{comment.user}}<br>
      <a href='#' class="rep_cmt" data-parentid=" 
 {{comment.id}}">Reply</a><br>
       {% for comment in comment.children.all %}
       {{comment}}
    {% endfor %}
 {%endfor%}
 {% if comments.has_next %}
<a class="infinite-more-link" href="?page={{ comments.next_page_number
}}">More</a>
{% endif %}

 <div class="loading" style="display: none;">
  Loading...
 </div>
<script>
    var infinite = new Waypoint.Infinite({
      element: $('.rep_cmt')[0],
      onBeforePageLoad: function () {
        $('.loading').show();
      },
      onAfterPageLoad: function ($items) {
        $('.loading').hide();
      }
    });
  </script>

In above i added script to render data in lazy loading process but it is not rendering

1
  • Please give a short summary of what you tried. Commented Feb 3, 2020 at 5:45

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.