如何在 django 应用程序中动态显示消息？

Question

我使用 django 创建了一个 web 应用程序，在其中一个部分中我要求用户提供反馈，并在单击提交按钮时向用户发送一封电子邮件，感谢他的反馈。

但是每次我点击提交时，页面都会自动刷新，电子邮件会成功发送但是我想要的是当用户点击提交时，我想在此处显示“谢谢”消息来代替反馈形式。和反馈表被删除

这是我index.html的一部分

<form action="" method="POST">    
    {% csrf_token %}
    <div>{{ form.message }}</div>
    <div>{{ form.email }}</div>
    <p class="formerrors" >{{ form.email.errors.as_text }}</p>
    <hr>
    <input id="submitbutton" type="submit" name="submit" value="Submit">
</form>

这是我的看法 def 索引（请求）：

if request.method == 'POST':
    form = FeedbackForm(request.POST)
    if form.is_valid():
        subject = "You got a message"
        message = form.cleaned_data['message']
        email = form.cleaned_data['email']
        actual_message = "You got a message from {} \n\n {} \n\nGo to work\nWith regards".format(email,message)
        recipients = ['example@mail.com']
        sender = 'example@mail.com'
        send_mail(subject, actual_message, sender ,recipients,fail_silently=False)

        return HttpResponseRedirect('')
else:
    form = FeedbackForm()
return render(request,'my_webapp/index.html',{'form':form})

我可以通过编写一个 JS onClick 函数来做到这一点，但有没有更好的方法来做到这一点？此外，内置的 django 消息刷新了我猜的页面，并且始终位于页面顶部。 我当然不希望我的页面被刷新并且希望消息出现在表单的位置。

Answer 1

您可以将带有 Ajax 的表单发送到您的 django 视图，并用成功回调的感谢信替换您的表单。

Answer 2

您应该使用AJAX 发送您的表单。对于响应部分，您可以在成功验证后从服务器发送消息，并在 AJAX 的 complete 函数中将表单的 display 属性更改为 none 以将其删除。然后使用javascript为您的响应消息创建一个元素。

Answer 3

实际上，您不必使用 AJAX 来实现这一点。当用户提交表单时，您可以使用django messages framework 创建消息。

像这样：

from django.contrib import messages

...
if request.method == 'POST':
    form = FeedbackForm(request.POST)
    if form.is_valid():
        ...
        messages.success("Thank you")

        # After submitted, redirect user to current page, the form will be reset
        return HttpResponseRedirect(request.path_info)
else:
    form = FeedbackForm()
return render(request,'my_webapp/index.html',{'form':form})

然后在您的模板上：

{% if messages %}
    {% for message in messages %}
        <p class="text-danger">{{ message }}</p>
    {% endfor %}
{% endif %}

<form action="" method="POST">    
    {% csrf_token %}
    <div>{{ form.message }}</div>
    <div>{{ form.email }}</div>
    <p class="formerrors" >{{ form.email.errors.as_text }}</p>
    <hr>
    <input id="submitbutton" type="submit" name="submit" value="Submit">
</form>

如果你想要一个 toastr 消息？，参考this answer