繼上一篇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有又能夠自動識別主鍵的機制。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM