day-58Django

項目

作一個小型的學員管理系統


班級表(classes):

id name
1 脫產8期
2 脫產9期


學生表(students):

id name class_id (外鍵關聯班級ID)

1    李晨       1
2    woge     1
3   劉偉        2


老師表(teacher):

id   name
1    zekai
2    lxx
3    eagon


teacher2class(對應關係表):

id tid(外鍵teacher) cid (外鍵classes)
1      1     1
2      1      2
3      2      1

html

單表(班級和老師表):

- 查
- 增

- 刪
- 改

一對多(學生表):

- 增
- 刪
- 改
- 查


多對多(teacher2class):

- 增
- 刪
- 改
- 查mysql

服務端主邏輯

from django.conf.urls import url
from django.contrib import admin
from django.shortcuts import HttpResponse, render, redirect

==================新url方式,增刪改查================
### 查看
def classes(request):
    import pymysql
    conn = pymysql.connect(host='127.0.0.1', user='root',  password='123', db='s8day58', charset='utf8')
    cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
    sql = "select * from classes"
    cursor.execute(sql)
    classes = cursor.fetchall()

    return render(request, "classes.html", {"classes":classes})

### 添加  
def add_class(request):                                             #分流獲取
    if request.method == 'GET':
        return render(request, "add_class.html")
    else:
        classname = request.POST.get('classname')
        print(classname)
        import pymysql
        conn = pymysql.connect(host='127.0.0.1', user='root', password='123', db='s8day58', charset='utf8')
        cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
        sql = "insert into classes (name) values (%s)"
        cursor.execute(sql, (classname,))
        conn.commit()

        return redirect("/classes/")                                 #重定向

## 刪除
def del_class(request):

    id = request.GET.get('id')                                      # html拼接url,獲取id方法
    import pymysql
    conn = pymysql.connect(host='127.0.0.1', user='root', password='123', db='s8day58', charset='utf8')
    cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
    sql = "delete from classes where id=%s"
    cursor.execute(sql, (id,))
    conn.commit()

    return redirect('/classes/')

## 修改
def up_class(request):                                              #分流獲取
    if request.method == 'GET':                
        id = request.GET.get('id')
        import pymysql
        conn = pymysql.connect(host='127.0.0.1', user='root', password='123', db='s8day58', charset='utf8')
        cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
        sql = "select * from classes where id=%s"
        cursor.execute(sql, (id,))
        classes = cursor.fetchone()
        print(classes)

        return render(request, "up_class.html", {"classid":classes['id'], "classname":classes['name']})
        
                                                  #往html傳id和name  1.傳id是爲了,返回服務器的時候知道改哪一個    2.傳name爲了讓輸入框有要修改以前的數據
                                                  #html那邊創建一個隱藏的輸入框,將id存放在裏面,輸入框就至關一個容器
        
        
    else:                                                       
        classname = request.POST.get('classname')
        id        = request.POST.get('classid')
        print(classname, id)
        import pymysql
        conn = pymysql.connect(host='127.0.0.1', user='root', password='123', db='s8day58', charset='utf8')
        cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
        sql = "update classes set name=%s where id=%s"
        cursor.execute(sql, (classname,id))
        conn.commit()

        return redirect('/classes/')

=======================模態框==================================
def modal_add_class(request):
    classname = request.POST.get('classname')
    print(classname)

    if not classname:
        return HttpResponse('nook')               #HttpResponse :瀏覽器走的http協議,因此能夠往瀏覽器發數據
    else:
        ## 廉價數據庫
        import pymysql
        conn = pymysql.connect(host='127.0.0.1', user='root', password='123', db='s8day58', charset='utf8')
        cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)
        sql = "insert into classes (name) values (%s)"
        cursor.execute(sql, (classname,))
        conn.commit()
        return HttpResponse('ok')




urlpatterns = [
 
    url(r'^classes/', classes),
    url(r'^add_class/', add_class),                #瀏覽器第一次跳轉
    url(r'^modal_add_class/', modal_add_class),
    url(r'^del_class/', del_class),
    url(r'^up_class/', up_class),
]

HTML主邏輯

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Title</title>
    <style>
 .shadow {
            background-color: black;
            height: 1000px;
            position: fixed;                                #定位
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0.4;                                    #透明度
            z-index: 999;
            display:none
        }
        .content{
            background-color: white;
            width:500px;
            height: 300px;
            position: fixed;
            top: 100px;
            left: 500px;
            right: 200px;
            z-index: 1000;                                    #內容層調到上面
            display:none                                    #隱藏在頁面中
        }
        #error{
            color: red;
        }
    </style>

</head>
<body>
    <h2>班級列表</h2>
    <a href="/add_class/">增長班級</a>                                            #跳轉到路由對應關係(a標籤跳轉的是get方式)
    <button id="btn">模態對話框添加班級</button>
    <table border="1px">
        <thead>
            <tr>
                <th>ID</th>
                <th>班級名稱</th>
                <th>操做</th>            
            </tr>
        </thead>
        <tbody>
            {% for item in classes %}                                            #遍歷添加列表行數
                <tr>
                    <td>{{ item.id }}</td>
                    <td>{{ item.name }}</td>
                    <td>
                        <a href="/del_class/?id={{ item.id }}">刪除</a>|          #a標籤將id數據傳到後臺的方法
                        <a href="/up_class/?id={{ item.id }}">更新</a>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>

<div class="shadow"></div>                                                        #遮罩層

<div class="content">                                                            #內容層

        班級名: <input type="text" name="classname" id="classname">                #模態框局部刷新,必須用ajax
        <input type="button" value="提交" id="tijiao">
        <input type="button" id="cancel" value="取消">
        <span id="error"></span>

</div>

</body>
<script
  src="http://code.jquery.com/jquery-1.12.4.js"
  integrity="sha256-Qw82+bXyGq6MydymqBxNPYTaUXXq7c8v3CwiYwLLNXU="
  crossorigin="anonymous"></script>

<script>
    $('#btn').click(function () {                                                #顯示模態框
        $(".shadow").show();
        $(".content").show();
    });
    $('#cancel').click(function () {                                            #隱藏模態框
        $(".shadow").hide();
        $(".content").hide();
    });

    $('#tijiao').click(function () {
        $.ajax({
            type: "POST",
            url : "/modal_add_class/",
            data:  {"classname":$('#classname').val()},                            #發往服務器的數據
            success: function (data) {                                            #data,服務器返回的數據
                if(data == 'ok'){
                    alert('添加成功!');                                            #彈出提示信息
                    window.location.href = '/classes/';                            #瀏覽器的重定向
                }else{
                    alert('添加失敗!');
                    $('#error').text(data)                                        #往標籤插入一條數據
                }

            }
        })
    });


</script>
</html>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Title</title>
</head>
<body>
<h2>添加班級</h2>
<form action="/add_class/" method="post">            輸入框提交的方式是post
    班級名稱: <input type="text" name="classname">    name=''是url查詢的惟一依據
    <input type="submit"  value="提交">
</form>

</body>
</html>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Title</title>
</head>
<body>
<h2>更新班級</h2>
<form action="/up_class/" method="post">
    <input type="hidden" name="classid" value="{{ classid }}">
    班級名稱: <input type="text" name="classname" value="{{ classname }}">
    <input type="submit"  value="提交">
</form>

</body>
</html>

 

補充:jquery

瀏覽器能夠自定製請求頭(好比驗證)ajax


搜索hexo能夠搭建博客


sql

相關文章
相關標籤/搜索
本站公眾號
   歡迎關注本站公眾號,獲取更多信息