I am currently trying to add an Ajax to my like button to prevent refreshing, I am not an expert in JS. I am trying to learn from mistakes and small training exercises like this one but I am getting the following error:
JavaScript
x
2
1
blog.models.Post.DoesNotExist: Post matching query does not exist.
2
and I don’t know the source and reason of this error.
Here is the views.py
JavaScript
1
26
26
1
def like_post(request):
2
user = request.user
3
4
if request.method == 'POST':
5
post_id = request.POST.get('post_id')
6
post_obj = Post.objects.get(id=post_id)
7
if user in post_obj.liked.all():
8
post_obj.liked.remove(user)
9
else:
10
post_obj.liked.add(user)
11
12
like, created = Like.objects.get_or_create(user=user, post_id=post_id)
13
if not created:
14
if like.value == 'Like':
15
like.value = 'Unlike'
16
else:
17
like.value = 'Like'
18
like.save()
19
context = {
20
'post_id': post_id,
21
}
22
if request.is_ajax:
23
html = render_to_string('blog/like_section.html',context, request=request)
24
return JsonResponse({'form': html})
25
return redirect('blog:post-detail', slug=post_obj.slug)
26
Here is the template like-section.html
JavaScript
1
15
15
1
<form action="{% url 'blog:like-post' %}" method="POST" class="like-form" id="{{post.id}}">
2
{% csrf_token %}
3
<input type="hidden" name="post_id" value='{{post.id}}'>
4
{% if user not in post.liked.all %}
5
<button id="like" class="bwhite sm-button" style="color: grey; background-color: Transparent; background-repeat:no-repeat; border: none; cursor:pointer; overflow: hidden; outline:none;">
6
<i class="far fa-thumbs-up" type="submit"></i>
7
</button>
8
{% else %}
9
<button id="like" class="bwhite sm-button" style="color: blue;background-color: Transparent; background-repeat:no-repeat; border: none; cursor:pointer; overflow: hidden; outline:none;" >
10
<i class="far fa-thumbs-up" type="submit"></i>
11
</button>
12
{% endif %}
13
<div class="like-count{{post.id}}">{{ post.num_likes }} Likes</div>
14
</form>
15
Here is the script
JavaScript
1
22
22
1
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
2
<script type="text/javascript"></script>
3
<script>
4
$(document).on('click', '#like', function(event){
5
event.preventDefault();
6
var pk = $(this).attr('value');
7
$.ajax({
8
type: 'POST',
9
url: '{% url "blog:like-post" %}',
10
data: {'post_id':pk, 'csrfmiddlewaretoken': '{{ csrf_token }}'},
11
dataType: 'json',
12
success: function(response){
13
$('#like-section').html(response['form'])
14
console.log($('#like-section').html(response['form']));
15
},
16
error: function(rs, e){
17
console.log(rs.responseText);
18
},
19
});
20
});
21
</script>
22
here is the post-details.html
JavaScript
1
6
1
<!-- Like -->
2
<div id="like-section">
3
{% include 'blog/like_section.html' %}
4
</div>
5
<!-- Like -->
6
Advertisement
Answer
I guest post_obj = Post.objects.get(id=post_id)
cause your code exception (https://docs.djangoproject.com/en/3.1/ref/exceptions/#objectdoesnotexist). For advise, there are 2 solutions:
JavaScript
1
11
11
1
# solution 1
2
try:
3
post_obj = Post.objects.get(id=post_id)
4
except Post.DoesNotExist:
5
# do something
6
7
# solution 2
8
post_obj = Post.objects.filter(id=post_id).first()
9
if not post_obj:
10
# do something
11
For me, I prefer solution 2
because it is more Pythonic :) by using the EAFP principle (What is the EAFP principle in Python?)