如何在不重载页面的情况下运行包含操作参数的视图函数
如何在不重载页面的情况下运行包含操作参数的视图函数
提问于 2019-04-14 19:52:50
我正在创建一个网站，允许用户发布评论和喜欢的帖子。我创建了一个视图函数，允许用户喜欢帖子，但不确定如何实现ajax或类似的技术来执行请求，而不重新加载页面。这样用户就不会丢失他们在页面上的位置，并且在喜欢一篇文章后必须向下滚动才能找到它。
在我的views.py
#this is the function i wish to run without reloading
def like(request, operation, id):
like = Post.objects.get(id=id)
if operation == 'add':
Like.make_like(request.user, like)
elif operation == 'remove':
Like.lose_like(request.user, like)
return HttpResponseRedirect('/Feed/')
#this is the view in which it is called
class FeedView(TemplateView):
template_name = 'feed.html'
def get(self, request):
form = HomeForm()
posts = Post.objects.all().order_by('-created')
users = User.objects.exclude(id=request.user.id)
try:
like = Like.objects.get(user=request.user)
likes = like.posts.all()
except Like.DoesNotExist:
like = None
likes = None
args = {
'form': form, 'posts': posts, 'users': users, 'likes': likes
}
return render(request, self.template_name, args)
def post(self, request):
form = HomeForm(request.POST)
if form.is_valid():
post = form.save(commit=False)
post.user = request.user
post.save()
text = form.cleaned_data['post']
form = HomeForm()
return HttpResponseRedirect('/Feed/')
args = {'form': form, 'text': text}
return render(request, self.template_name, args)feed.html
{% for post in posts %}
<p class="name">{{ post.user.username }}</p>
<h3>{{ post.post }}</h3>
{% if not post in likes %}
<li-r><a class="like" href="{% url 'like' operation='add' id=post.id %}"> {{ post.total_likes }} </a></li-r>
{% endif %}
{% if post in likes %}
<li-r><a class="unlike" href="{% url 'like' operation='remove' id=post.id %}"> {{ post.total_likes }} </a></li-r>
{% endif %}
<p class="date">{{ post.created }}</p>
{% endfor %}urls.py
urlpatterns = [
url(r'^Feed/$', FeedView.as_view(), name='feed'),
url(r'^like/(?P<operation>.+)/(?P<id>\d+)/$', views.like, name='like')
]我试过将这个函数放在Feed类中，但是我不知道如何编写url来包含这个类和"(?P<operation>.+)/(?P<id>\d+)"部分，或者这是否能解决我的问题。但我认为我可以使用ajax，尽管我不知道如何使用。
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-15 02:07:04
您需要在这里使用Ajax。在like/dislike锚点标记上使用onclick事件侦听器，进行ajax调用，并根据响应更新计数。
$('.like, .unlike').click(function(e){
e.preventDefault();
var url = $(this).attr('href'));
// make a get call on this url, and update the total_likes based on response
$.get(url, function( data ) {
$(this).text(data.total_likes); //something like that
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55674955
复制相关文章
相似问题