迹忆客 专注技术分享

当前位置:主页 > 学无止境 >

在 Python 中将 Ajax 与 Django 集成

作者:迹忆客 最近更新:2023/02/27 浏览次数:

本文旨在演示 Ajax 是什么,将 Ajax 与 Django 集成,从浏览器发送 Ajax 的 getpost 请求,并用 Python 处理 Django 站点上的数据。

Ajax 代表异步 JavaScript 和 XML,但这是什么意思?Ajax 只是一种 Web 开发技术,用于在后台发送和检索数据而无需刷新网页。

一个真实的 Ajax 示例是,如果我们前往 Twitter 并打开我们的提要。

一段时间后,你会看到屏幕顶部出现一个菜单栏,指示有新的推文可用,如果你等待更长的时间,你会看到随着越来越多的人在 Twitter 上发布内容,数量会增加。

我们需要注意的是,我们的页面永远不会完全刷新。现在我们对 Ajax 有了一些了解,让我们看看如何在 Django 框架中使用它。

我们创建了一个简单的项目来演示如何使用 Ajax,但是不可能演示如何使用我们的整个项目。如果你熟悉 Django,那么你已经知道如何创建 Django 项目,因此我们有一个名为 contact 的模型,其中包含一些字段和一个用于联系模型表单的简单模型。

当我们提交表单时,数据将被保存到数据库中,重定向到同一页面本身,并设置相应的 URL。

我们使用 jQuery 来触发 Ajax,还需要 CDN。所以每当我们提交表单时,我们会在表单中做的逻辑是,如果表单有效,服务器就会响应。

我们使用常规的 JavaScript 来获取表单的对象,所以我们需要一个 submit 事件,如果该事件被触发,它将调用一个 submithandler 函数。

我们创建了一个 submithandler 函数,它会默认接收事件,我们要阻止表单提交的默认操作,这意味着表单不会被提交,所以要发出 Ajax 请求,我们将在我们的 HTML 文件。

我们将在 Ajax 对象中指定一些属性;第一个是 type,它是一种请求。

我们可以传递两种类型的请求; getpost,所以我们必须通过 post。下一个属性是 url,这意味着我们要点击 post 请求的 URL。

所以我们将在这里使用 Django 模板索引;我们将传递我们的 contact 页面的 URL。contact 是我们稍后将在 url.py 中编写的 URL 的名称。

现在下一个是 data,这意味着我们希望表单数据在服务器端,以便在服务器上处理表单数据。因此,我们需要使用表单 ID 在 Ajax 请求中发送该数据。

下一个是 dataType,它是我们期望从服务器返回的数据类型,所以如果我们在视图中发送一些 HTTP 响应并且表单是有效的或发送一些 JSON 数据,我们需要以 JSON 格式传递数据格式,所以我们以 JSON 类型传递它。

我们为最后一个传递了 success 属性,它接受一个名为 successFunction 的函数。如果请求成功,此函数将弹出一个警报窗口。

<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
        crossorigin="anonymous"></script>

<script>
    const form = document.getElementById('form');
    form.addEventListener("submit", submitHandler);

    function submitHandler(e) {
        e.preventDefault();
        $.ajax({
            type        : 'POST', // define the type of HTTP verb we want to use (POST for our form)
            url         : '{% url 'contact' %}', // the url where we want to POST
            data        : $('#form').serialize(), // our form data
            dataType    : 'json', // what type of data do we expect back from the server
            success     : successFunction
        });
    }

    function successFunction(msg) {
        if (msg.message === 'success') {
            alert('Success!');
            form.reset()
        }
    }
</script>

现在我们需要设置名称为 contact 的 URL,并从 views.py 文件中调用 contact 方法,这意味着当用户点击此 URL 时,将调用 contact 方法。

urlpatterns = [
    path('', views.contact, name='contact'),
]

现在我们可以在 views.py 文件中做一些事情,所以我们知道每当我们提交表单时,contact 函数会调用相应的函数并捕获它,它会收到一个 Ajax 请求并检查 Ajax 使用 .is_ajax() 方法的请求是否有效。

from django.http import JsonResponse
from django.shortcuts import render, redirect
from .forms import ContactModelForm

def contact(request):
    form = ContactModelForm()

    if request.is_ajax():
        form = ContactModelForm(request.POST)
        print(request.POST)
        if form.is_valid():
            form.save()
            return JsonResponse({
                'message': 'success'
            })
    return render(request, 'contact.html', {'form': form})

点击这里阅读官方文档,将 Ajax 与 Django 集成。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

Python 中的第一类函数

发布时间:2023/04/25 浏览次数:113 分类:Python

第一类函数是被语言视为对象或变量的函数。 我们可以将它们分配给变量或将它们作为对象传递给其他函数。Python 支持第一类函数的功能。

Python 函数参数类型

发布时间:2023/04/25 浏览次数:140 分类:Python

在这篇 Python 文章中,我们将学习 Python 中使用的函数参数类型。 我们还将学习如何编写不带参数的 Python 函数。

Python 生成器中的 send 函数

发布时间:2023/04/25 浏览次数:111 分类:Python

本教程将介绍如何在 Python 中使用生成器的 send() 函数。我们可以创建一个像迭代器一样运行的函数,并且可以通过 Python 生成器函数在 for 循环中使用。

Python Functools 偏函数

发布时间:2023/04/25 浏览次数:80 分类:Python

本文介绍了我们如何使用分部函数,该函数随 functools 库一起提供,并附有示例。 这显示了调用时如何传递属性和部分函数。

Python main() 函数中的参数

发布时间:2023/04/25 浏览次数:157 分类:Python

在本教程结束时,我们应该了解Python 中在 main() 中使用参数是否是一种好的做法。

Python 中的内置 identity 函数

发布时间:2023/04/25 浏览次数:88 分类:Python

identity 函数只是一个返回其参数的函数。 当我们定义一个恒等函数并赋值时,它会返回该值。在本教程结束时,我们将了解 Python 是否具有内置的 identity 函数。

在 Python 中拟合阶跃函数

发布时间:2023/04/25 浏览次数:177 分类:Python

阶跃函数是带有看起来像一系列步骤的图形的方法。 它们由一系列中间有间隔的水平线段组成,也可以称为阶梯函数。本文给出了阶跃函数的简单演示。

在 Python 中创建双向链表

发布时间:2023/04/25 浏览次数:54 分类:Python

双向链表是指由称为节点的顺序链接的记录集组成的链接数据结构。 每个节点包含一个前一个指针、一个下一个指针和一个数据字段。

将 Python 类对象序列化为 JSON

发布时间:2023/04/25 浏览次数:152 分类:Python

本教程介绍序列化过程。 它还说明了我们如何使用 toJSON() 方法使 JSON 类可序列化,并包装 JSON 以转储到其类中。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便