用Django和AJAX创建一个待办事项应用

发布于:2025-04-15 ⋅ 阅读:(29) ⋅ 点赞:(0)

用Django和AJAX创建一个待办事项应用

推荐超级课程:

在这里插入图片描述

让我们创建一个简单的 Django 项目,其中包含不同类型的 AJAX 请求示例,例如 GET、POST、PUT 和 DELETE。在这个示例中,我们将创建一个简单的待办事项列表应用程序,用户可以使用 AJAX 添加、编辑、删除和标记任务为完成。
首先,确保您已安装 Django。您可以使用 pip 安装它:

pip install django

让我们创建一个新的 Django 项目称为 “todo_project” 和一个 Django 应用程序称为 “todo_app”。

django-admin startproject todo_project  
cd todo_project  
python manage.py startapp todo_app

现在,让我们为待办事项应用程序定义模型、视图和 URL。
todo_app/models.py 中:

from django.db import models  
class TodoItem(models.Model):  
    title = models.CharField(max_length=200)  
    completed = models.BooleanField(default=False)  
    def __str__(self):  
        return self.title

初始化数据库:

python manage.py migrate
  • 此命令根据您的 Django 应用程序中定义的模型创建必要的数据库表。它查看每个应用中的 models.py 文件并创建相应的数据库模式。
    创建初始迁移:
python manage.py makemigrations

此命令检查您模型的当前状态,并在 todo_app/migrations/ 目录中创建迁移文件。这些文件包含根据您模型中的更改更新数据库模式的指令。
应用迁移:

python manage.py migrate

此命令执行迁移,将更改应用于数据库模式。它读取在 makemigrations 步骤中创建的迁移文件,并相应地更新数据库。
创建一个超级用户以访问 Django 管理界面:

python manage.py createsuperuser

按照提示设置用户名、电子邮件和密码。
todo_app 目录中创建一个 templates 文件夹,并将 todo_list.html 放置在 templates/todo_app/ 中。
todo_app/views.py 中,定义用于显示待办事项列表、添加、更新和删除待办事项的视图。相应地更新同一目录中的 urls.py

from django.shortcuts import render, HttpResponse, get_object_or_404  
from django.views.decorators.csrf import csrf_exempt  
from django.http import JsonResponse  
from .models import TodoItem  
import json  
def todo_list(request):  
    todos = TodoItem.objects.all()  
    return render(request, 'todo_app/todo_list.html', {
   'todos': todos})  
@csrf_exempt  
def add_todo(request):  
    if request.method == 'POST':  
        data = json.loads(request.body)  
        title = data['title']  
        todo = TodoItem.objects.create(title=title)  
        return JsonResponse({
   'id': todo.id, 'title'