Django Post请求不会在按钮点击时发送

2vuwiymt 于 2023-02-05 发布在 Go

关注(0)|答案(4)|浏览(179)

我尝试在Django中创建一个简单的Web应用程序，并尝试使用 AJAX 使页面不会刷新。这个应用程序的唯一目标是有一个表单，接受一些用户输入，并且在表单提交时不会刷新。然而，由于某种原因，当我点击按钮时，这并没有发生。下面是索引页面：

<!DOCTYPE html>
<html>
<body>
<h2>Create product here</h2>
<div>
<form id="new_user_form">
  <div>
  <label for="name" > Name:<br></label>
  <input type="text" id="name"/>
  </div>
  <br/>
  <div>
  <label for="email"> email:<br></label>
  <input type="text" id="email"/>
  </div>
  <div>
  <label for="password" > password:<br></label>
  <input type="text" id="password"/>
  </div>
  <div>
    <input type="submit" value="submitme"/>
  </div>
</form>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type = "text/text/javascript">
  $(document).on('submitme', '#new_user_form', function(e)){
    e.preventDefault()
    $.ajax({
      type: 'POST',
      url:'/user/create',
      data:{
        name:$('#name').val(),
        email:$('#email').val(),
        password:$('#password').val(),
      }
      success.function(){
        alert('created')
      }
    })
  }
</script>
</html>

下面是我的主要urls.py文件：

from django.contrib import admin
from django.urls import path
from django.conf.urls import include, url
from testapp import views
import testapp
from django.views.decorators.csrf import csrf_exempt

urlpatterns = [
    path('admin/', admin.site.urls),
    url(r'^$', testapp.views.index),
    url(r'^user/create/$', csrf_exempt(testapp.views.create_user))
]

我的views.py文件：

from django.shortcuts import render
from testapp.models import User
from django.http import HttpResponse

# Create your views here.
def index(request):
    return render(request, 'index.html')

def create_user(request):
    if request.method == 'POST':
        name = request.POST['name']
        email = request.POST['email']
        password = request.POST['password']

        User.objects.create(
            name = name,
            email = email,
            password = password
        )

        return HttpResponse('')

最后是models.py文件：

from django.db import models

# Create your models here.
class User(models.Model):
    name = models.CharField(max_length = 32)
    email = models.EmailField()
    password = models.CharField(max_length = 128)

这样做的目的是当按钮被点击时，它应该发送一个POST请求到后端，后端创建一个用户类型的对象并将其保存到数据库。然而，由于某种原因，当我点击提交时，没有POST请求被发送到Chrome上的网络工具。有人能帮我吗？

django

来源：https://stackoverflow.com/questions/53210329/django-post-request-not-sent-on-button-click

4条答案

按热度按时间

iq0todco1#

def create_user(request):
    if request.method == 'POST':
        form = SignUpForm(request.POST)
        if form.is_valid():
            form.save()
            username = form.cleaned_data.get('username')
            raw_password = form.cleaned_data.get('password')
            user = authenticate(username=username, password=raw_password)
            auth_login(request, user)
            return render(request, 'accounts/index.html')
    else:
        form = SignUpForm()
    return render(request, 'accounts/signup.html', {'form': form})

你的代码应该看起来更像这样。在这里我使用默认的django认证系统，所以没有真实的需要你的model.py，至少现在没有。也看看我添加的渲染-与HttpReponse你的页面将重新加载。电子邮件自动保存与form.submit()
SignUpForm应简单明了：

class SignUpForm(UserCreationForm):
    email = forms.EmailField(max_length=254, help_text='Required.')

赞(0）回复(0）举报 2023-02-05

cotxawn72#

您的代码看起来不错，但是我想帮助您做以下更改：****我编辑并更新了我的帖子，因为我之前的建议中有一些部分不适用于您的情况（因为ajax contentType在您的情况下是可以的，等等...），所以为了您的目的，我清除了我的答案：

- 一、

在HTML表单中，输入名称应在输入字段中给出，因为这样更容易使用AJAX提交输入HTML表单值：

<input type="text" name="name" id="name"/>

<input type="email" name="email" id="email"/>

<input type="password" name="password" id="password"/>

提交按钮应更改如下：

<button type="button" name="submitme" id="submitme">Submit</button>

- 二、**

你的AJAX调用应该这样重新表述（我认为你的url中缺少了尾部斜杠，data的格式可能比你做的更简单，click函数现在在button id上。代码中的右括号被清除：

<script type = "text/text/javascript">
var $ = jQuery.noConflict();
$( document ).ready(function() {
  $('#submitme').on('click', function(e){
    e.preventDefault();
    $.ajax({
        type: 'POST',
        url:'/user/create/',
        data: $('form').serialize(),
        success: function(){
            alert('created');
        }
    })
  })
});
</script>

您的视图应该如下所示，以获取ajax提交的数据并另存为新用户（只需进行很小的修改）：

def create_user(request):
    if request.method == 'POST':
        name = request.POST.get('name')
        email = request.POST.get('email')
        password = request.POST.get('password')

        new_user = User.objects.create(
            name = name,
            email = email,
            password = password
        )

        new_user.save()

        return HttpResponse('')

现在它必须这样工作了。我希望这会对你有帮助。

赞(0）回复(0）举报 2023-02-05

6tdlim6h3#

不确定这个答案的相关性有多大，但是没有为您创建“POST”请求的唯一原因是您在JS中写入了<script type = "text/text/javascript">而不是<script type = "text/javascript">

赞(0）回复(0）举报 2023-02-05

cxfofazt4#

尝试将方法“POST”和操作“{% url 'url_name' %}”添加到html表单。还要将名称添加到创建用户的url。

赞(0）回复(0）举报 2023-02-05