zoukankan      html  css  js  c++  java
  • 继上一篇Django的数据库数据的编辑和删除

    继上一篇Django的数据库数据的编辑和删除

    首先需要写一个能够展示数据库一张表中所有数据的 html 页面

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        {% load static %}
        <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
        <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
    </head>
    <body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <h1 class="text-center">数据展示</h1>
                <table class="table table-hover table-striped table-bordered">
                    <thead>
                        <tr >
                            <th>主键值</th>
                            <th>用户名</th>
                            <th>密码</th>
                            <th class="text-center">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for user_obj in user_queryset %}
                            <tr>
                                <td>{{ user_obj.id }}</td>
                                <td>{{ user_obj.username }}</td>
                                <td>{{ user_obj.password }}</td>
                                <td class="text-center">
                                    <a href="/edit_user/?edit_id={{ user_obj.id }}" class="btn btn-primary btn-sm">编辑</a>
                                    <a href="/delete_user/?delete_id={{ user_obj.pk }}" class="btn btn-danger btn-sm">删除</a>
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    </body>
    </html>
    

    上面的两个 a 标签,一个是编辑一个是删除,点击会跳转到对应的 html 页面。

    注意: href 里的链接,一定要在前面加上一个 "/" ,这样他的跳转才会是‘’http://127.0.0.1:8001/edit_user/?edit_id=1‘’ ,如果你没有加上斜杆,点击将会失效,每次点击都会拼接上一个edit_user,而不会跳转到对应的 html 界面。

    views 里的业务逻辑:

    def userlist(request):
        # 获取用户表中的所有的数据
        user_queryset = models.Userinfo.objects.all()  # 结果类似于列表套数据对象 里面是当前表的所有数据对象
        # print(user_queryset.query)  # 只有queryset对象才能够点query查询内部所对应的sql语句
        # print(user_queryset)
        # 将数据传递给前端页面展示给用户看
        return render(request,'userlist.html',locals())
    

    这里会把所有的数据都传到前端,前端展示。

    当用户点击了编辑以后,就会跳转到编辑界面,以下是编辑的逻辑代码:

    def edit_user(request):
        # 1.如何获取用户想要编辑的数据
        edit_id = request.GET.get('edit_id')
        if request.method == 'POST':
            # 将用户新修改的所有的数据
            username = request.POST.get("username")
            password = request.POST.get("password")
            """POST中也是可以获取GET请求携带的参数"""
            # 去数据库中修改对应的数据
            # 方式1:
               models.Userinfo.objects.filter(pk=edit_id).update(username=username,password=password)					      				
              
                # 批量更新
            # 方式2: 获取当前数据对象 然后利用对象点属性的方式 先修改数据  然后调用对象方法保存
            # 不推荐你使用第二种方式  效率低   挨个重新写入一遍
            # edit_obj = models.Userinfo.objects.filter(pk=edit_id).first()  # pk能够自动帮你查询出当前表的主键字段名
            # edit_obj.username = username
            # edit_obj.password = password
            # edit_obj.save()
            """update方法会将filter查询出来的queryset对象中所有的数据对象全部更新"""
            # 跳转到数据展示页面
            return redirect('/user_list')
        # 2.根据主键值去数据库中查询出当前对象 展示给用户看
        edit_obj = models.Userinfo.objects.filter(pk=edit_id).first()  # pk能够自动帮你查询出当前表的主键字段名
        # 3.将查询出来的数据对象传递给前端页面 展示给用户看
        return render(request,'edit_user.html',locals())
    

    获取到前端传来的数据之后,直接查询,然后修改,最后在重定向到userlist界面

    编辑界面前端代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script>
    
    </head>
    <body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <h2 class="text-center">编辑页面</h2>
                <form action="" method="post">
                    username:<input type="text" class="form-control" name="username" value="{{ edit_obj.username }}">
    
                    password:<input type="text" class="form-control" name="password" value="{{ edit_obj.password }}">
    
                    <br>
                    <input type="submit" class="btn btn-warning">
                </form>
    
            </div>
        </div>
    </div>
    </body>
    </html>
    

    通过submit向后端发送数据,然后后端(也就是上面的逻辑代码)进行处理修改,最后在重定向到展示界面,这时候数据已经修改了。

    删除的业务逻辑:

    def delete_user(request):
        # 获取想要删除的数据id 直接删除
        delete_id = request.GET.get('delete_id')
        models.Userinfo.objects.filter(pk=delete_id).delete()  # 批量删除
        return redirect('/userlist')
    
    

    在user_list界面点击了删除按钮以后,会调用 delete_user方法,删除之后重定向。

    这里要注意:每次点击删除按键,都相当于删除了数据库中的相关记录,并且重定向到这个页面,也就相当于刷新了页面。

    user_list 界面有很多条数据,也有很多个编辑、删除按键,那么怎么样才能让后端知道我们要操作的是哪一条数据呢?

    答:因为我们在user_list里面传了一个列表套数据到前端去,所以前端可以直接获取每条记录的id值,那么前端获取了每一个id之后,把它和每个编辑以及删除一一对应,也就是a标签里的url,所以每个后端逻辑代码都可以接收到唯一的id值,就可以进行操作了。

    值得一提的是,也是重点,pk等于id,并且推荐用pk,Django有又能够自动识别主键的机制。

  • 相关阅读:
    BERT基础知识
    TorchText使用教程
    Pytorch-中文文本分类
    预处理算法_5_数据集划分
    预处理算法_4_表堆叠
    预处理算法_3_新增序列
    预处理算法_2_类型转换
    预处理算法_1_表连接
    爬取网站所有目录文件
    如何将Docker升级到最新版本
  • 原文地址:https://www.cnblogs.com/chanyuli/p/11722061.html
Copyright © 2011-2022 走看看