使用ajax在django中刷新页面而不重新加载它? [英] refresh a page in django using ajax without reloading it?
本文介绍了使用ajax在django中刷新页面而不重新加载它?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在构建一个消息传递应用程序,我想每1分钟重新加载一次页面,以便用户可以看到新消息(如果有的话,我知道如何用html进行操作,但是我想使用ajax(我不太好)在其中)以重新加载页面.这是我的views.py:
I am building a messaging app and i want to reload my page every 1 minute so that the user can see new messages if there is some i know how to do it in html but i wanna use ajax(i am not so good in it) to reload the page. here is my views.py:
class MessagesView(LoginRequiredMixin,View):
def get(self, request, chat_id):
try:
chat = Chat.objects.get(id=chat_id)
if request.user in chat.members.all():
chat.message_set.filter(is_readed=False).exclude(author=request.user).update(is_readed=True)
else:
chat = None
except Chat.DoesNotExist:
chat = None
return render(
request,
'users/messages.html',
{
'user_profile': request.user,
'chat': chat,
'form': MessageForm()
}
)
def post(self, request, chat_id):
form = MessageForm(data=request.POST)
if form.is_valid():
message = form.save(commit=False)
message.chat_id = chat_id
message.author = request.user
message.save()
return redirect(reverse('messages', kwargs={'chat_id': chat_id}))
我的模板是:
{% extends 'profile/base.html' %}
{% load tz %}
{% block title %}
Messages
{% endblock %}
{% block head %}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<style>
#form {
position: fixed;
bottom: 0;
background-color:#f1f1f1;
}
.container {
border: 1px solid #dedede;
background-color: #f1f1f1;
border-radius: 5px;
padding: 1px;
margin: 1px 0;
}
.container::after {
content: "";
clear: both;
display: table;
}
.darker {
border-color: #ccc;
background-color:#ddd;
}
.container img {
float: left;
max-width: 40px;
height:40px;
width: 100%;
margin-right: 20px;
border-radius: 50%;
}
.time-left {
margin-left:61px;
color: #999;
}
h4 {
display:inline;
}
</style>
{% endblock %}
{% block content %}
{% if not chat %}
<div class="container">
Impossible de commencer un chat avec cet utilisateur ou bien vous n'avez pas acces a ce chat.
</div>
{% else %}
{% if chat %}
<div class="panel">
{% for message_item in chat.message_set.all %}
{% url 'profile' message_item.author.pk as the_user_url%}
{% if message_item.is_readed %}
<div class="container">
{% else %}
<div class="container darker">
{% endif %}
<a href="{{ the_user_url }}">
<img src="{{ message_item.author.profile.avatar.url }}" alt="Avatar" style="width:100%;">
<h4><a href="{{ the_user_url }}">{{ message_item.author.profile.prenom|title }}</a></h4>
<p>{{ message_item.message }}</p>
<span class="time-left">{{ message_item.pub_date|utc }}</span>
</a>
</div>
{% endfor %}
<br><br><br><br>
</div>
</div>
{% endif %}
<div class='w3-container'>
<div id='form'>
<form method="post" action='{% url 'messages' chat.id %}'>
{% csrf_token %}
{{ form.as_p }}
<input type="submit" value='envoyez' />
</form>
</div>
</div>
{% endif %}
{% endblock %}
我知道websocket是最好的解决方案,但是现在我不需要它,我只需要用ajax重新加载我的页面即可.我将不胜感激
i know websocket is the best solution but for now i don't need it i just need ajax to reload my page.i will appreciate any help
推荐答案
在模板块内放置
<script>
setTimeout('location.reload()', 60000)
</script>
根本不需要使用Ajax.重新加载页面会在页面URL上获取请求.
No need to use ajax at all. Reloading a page makes a get request on the page url.
这篇关于使用ajax在django中刷新页面而不重新加载它?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文