Javascript 如何在django中提交表单而不刷新？

我知道这个问题可能与stackoverflow中的许多问题重复。但这些都帮不了我。 我试过了，但没有成功

我的

models.py

是：

类消息（models.Model）：
id=models.CharField（最大长度=8，主键=True）
messages=models.TextField（）

这是我的

html

{%csrf_令牌%}
消息



提交

这是我的

视图。py

：

def消息（请求）：
如果request.method==“POST”：
message=Messages（）
message.messages=request.POST['message']
message.save（）
返回重定向（'消息'）
返回呈现（请求'app/messages.html'，上下文）

这是我的

脚本

：

$（文档）.on（'submit'，'new#message_form'，函数（e）{
e、 预防默认值（）；
$.ajax({
键入：“POST”，
url:“/messages/”，
数据：{
消息：$（“#消息”）.val（），
csrfmiddlewaretoken:$（'input[name=csrfmiddlewaretoken]'）。val（），
},
成功：函数（）{
警报（“已创建新邮件！”）
}
});
});

这会导致多值错误

Internal Server Error: /messages/
Traceback (most recent call last):
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\utils\datastructures.py", line 76, in __getitem__
    list_ = super().__getitem__(key)
KeyError: 'message'

During handling of the above exception, another exception occurred:

Traceback (most recent call last):
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\exception.py", line 34, in inner
    response = get_response(request)
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\base.py", line 115, in _get_response
    response = self.process_exception_by_middleware(e, request)
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\base.py", line 113, in _get_response
    response = wrapped_callback(request, *callback_args, **callback_kwargs)
  File "C:\Users\mowli\Desktop\Projects\gcepac\app\views.py", line 17, in messages
    message.messages = request.POST['message']
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\utils\datastructures.py", line 78, in __getitem__
    raise MultiValueDictKeyError(key)
django.utils.datastructures.MultiValueDictKeyError: 'message'
[16/Apr/2020 18:12:30] "POST /messages/ HTTP/1.1" 500 90361

相反，我尝试了

message.messages=request.POST.get（'message'，False）

只从输入中获取值并传递。但是我不能不刷新就提交它。有人能帮我吗

编辑1-多值错误

Internal Server Error: /messages/
Traceback (most recent call last):
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\utils\datastructures.py", line 76, in __getitem__
    list_ = super().__getitem__(key)
KeyError: 'message'

During handling of the above exception, another exception occurred:

Traceback (most recent call last):
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\exception.py", line 34, in inner
    response = get_response(request)
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\base.py", line 115, in _get_response
    response = self.process_exception_by_middleware(e, request)
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\core\handlers\base.py", line 113, in _get_response
    response = wrapped_callback(request, *callback_args, **callback_kwargs)
  File "C:\Users\mowli\Desktop\Projects\gcepac\app\views.py", line 17, in messages
    message.messages = request.POST['message']
  File "C:\Users\mowli\AppData\Local\Programs\Python\Python38-32\lib\site-packages\django\utils\datastructures.py", line 78, in __getitem__
    raise MultiValueDictKeyError(key)
django.utils.datastructures.MultiValueDictKeyError: 'message'
[16/Apr/2020 18:12:30] "POST /messages/ HTTP/1.1" 500 90361

编辑2 实际上，在使用此工具时，表单甚至没有提交

message.messages=request.POST.get（'message'，False）

---

这将在db中提交值为“False”的表单。一旦表格提交，我应该得到一个警告，对吗？所以请省略这一部分。

我注意到你的脚本有问题

csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken').val(),

如果你复制了它，那就是导致错误的原因。试试这个

csrfmiddlewaretoken: $("input[name='csrfmiddlewaretoken']").val(),

解决方案1 让我们来解决这个问题，有两种解决方案。这是一个简单的解决方案，只是一个更好的解决方案，以消除无用的痛苦。将脚本放在HTML文件中，并使用此行

csrfmiddlewaretoken: '{%csrf_token%}'

而不是

csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(),

---

解决方案2 另一个解决方案是修复您自己的解决方案。AJAX按钮不是submit按钮，它们只是按钮，从表单中删除

操作

，并将按钮类型更改为

按钮

，它应该可以工作

---

编辑：问题不在

csrf\u令牌中

，但是我想将第一个解决方案展示为实现您所需的更简单的方法。

---

---

BUG 2为什么不起作用，我已经回答了这个问题

如果你能完整地发布错误消息，那会更好。尝试从表单标签中删除操作，我认为如果你通过javascript制作ajax，你不需要它。即使没有

操作

它仍然是一样的。只有数据通过AJAX传递。但这仍然是令人耳目一新的，没有任何改变。在输入问题时，这可能是一个错误！实际上，这应该是一个注释，因为我已经在html表单中使用了脚本，解决方案1不起作用。如果我的

csrf令牌出现错误

，我想我应该得到csrf错误。对于解决方案2，删除

操作

并将类型更改为

按钮

没有进行任何更改。另外，我猜第一个参数

$document.on（'submit'..

指的是按钮的类型

submit

。我错了吗？不，它指的是表单本身的提交事件，按钮只是触发事件解决方案1不起作用，因为

csrf_令牌

不是我在编辑中所说的问题。但是，解决方案不起作用。您有其他工作方法吗我可以理解，新创建的对象不能立即呈现，但为什么不提交表单？