1.在pycharm中新建project demo1 添加app01 点击create按钮完成新建
2.在demo项目目录下新建目录static,并在settings.py中追加代码:
1 | STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static' ),) |
3.在setting.py中添加模板路径:
1 2 3 4 5 6 7 8 9 10 11 12 | TEMPLATES = [ { 'BACKEND' : '...' , 'DIRS' : [os.path.join(BASE_DIR, 'templates' ),], 'APP_DIRS' : ..., 'OPTIONS' : { 'context_processors' : [ ... ], }, }, ] |
4.学员管理系统数据库设计:
在app01/model.py目录下建立 班级、老师、学生 、老师与班级关联表 四张表:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | from django.db import models # Create your models here. class Classes(models.Model): ''' 班级表 ''' title = models.CharField(max_length = 32 ) a = models.ManyToManyField( 'Teachers' ) class Teachers(models.Model): ''' 老师表 ''' name = models.CharField(max_length = 32 ) class Students(models.Model): username = models.CharField(max_length = 32 ) age = models.IntegerField() gender = models.BooleanField() cs = models.ForeignKey(Classes,on_delete = models.CASCADE) |
在终端Terminal 项目目录下执行数据表更新命令:
1 2 | python manage.py makemigrations python manage.py migrate |
至此生成了四张数据表,可以在pycharm中,点开右上角的Database面板,然后将项目中templates目录下边的db.sqlite3鼠标拖拽到Database面板下,对新创建的数据表进行查看。
5.学员管理系统之班级管理:
为了方便分别操作班级、老师、学生相关的业务,将app01目录下的views.py 删掉,在app01目录下新建目录views,并在views目录下 新建classes.py teachers.py students.py。
1.在classes.py 中写 get_classes add_classes del_classes edit_classes四个函数,完成对 班级数据 的增删改查:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | from django.shortcuts import render,redirect from app01 import models def get_classes(request): cls_list = models.Classes.objects. all () return render(request, 'get_classes.html' ,{ 'cls_list' :cls_list}) def add_classes(request): if request.method = = 'GET' : return render(request, 'add_classes.html' ) elif request.method = = 'POST' : title = request.POST.get( 'title' ,'') models.Classes.objects.create(title = title) return redirect( '/classes.html' ) def del_classes(request): nid = request.GET.get( 'nid' ,'') models.Classes.objects. filter ( id = nid).delete() return redirect( '/classes.html' ) def edit_classes(request): if request.method = = "GET" : nid = request.GET.get( 'nid' , '') obj = models.Classes.objects.get( id = nid) return render(request, 'edit_classes.html' ,{ 'obj' :obj}) elif request.method = = "POST" : nid = request.POST.get( 'nid' ,'') title = request.POST.get( 'xxoo' ,'') models.Classes.objects. filter ( id = nid).update(title = title) return redirect( '/classes.html' ) |
2.在urls.py 中配置url路由:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | from django.contrib import admin from django.urls import path from app01.views import classes,students,teachers urlpatterns = [ path( 'admin/' , admin.site.urls), path( 'classes.html' , classes.get_classes), path( 'add_classes.html' , classes.add_classes), path( 'del_classes.html' , classes.del_classes), path( 'edit_classes.html' , classes.edit_classes), # path('teachers.html', teachers.get_teachers), # path('students.html', students.get_studernts), ] |
3.在template目录下建立所需的html页面文件:
get_classes.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | <!DOCTYPE html> < html lang="en"> < head > < style > tr td{ border:1px solid #000;text-align:center;} </ style > < meta charset="UTF-8"> < title >Title</ title > </ head > < body > < div > < table width="300"> < thead > < tr > < th >ID</ th > < th >名称</ th > < th >操作</ th > </ tr > </ thead > < tbody > {% for row in cls_list %} < tr > < td >{{ row.id }}</ td > < td >{{ row.title }}</ td > < td >< a href="/del_classes.html?nid={{ row.id }}">删除</ a > |< a href="/edit_classes.html?nid={{ row.id }}">编辑</ a > </ td > </ tr > {% endfor %} </ tbody > </ table > </ div > < div >< a href="/add_classes.html">添加</ a > </ div > </ body > </ html > |
add_classes.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <! DOCTYPE html> < html lang="en"> < head > < meta charset="UTF-8"> < title >Title</ title > </ head > < body > < form action="/add_classes.html" method="post"> {% csrf_token %} < input type="text" name="title"> < input type="submit" value="提交"> </ form > </ body > </ html > |
edit_classes.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <! DOCTYPE html> < html lang="en"> < head > < meta charset="UTF-8"> < title >Title</ title > </ head > < body > < form method="post" action="/edit_classes.html"> {% csrf_token %} < input type="hidden" name="nid" value="{{ obj.id }}"> < input type="text" name="xxoo" value="{{ obj.title }}"> < input type="submit" value="提交"> </ form > </ body > </ html > |
6.学员管理系统之学员管理:
1.在students.py 中写 get_students add_students del_students edit_students 四个函数,完成对 学生数据 的增删改查:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 | from django.shortcuts import render,redirect from app01 import models def get_students(request): stu_list = models.Students.objects. all () return render(request, 'get_students.html' ,{ 'stu_list' :stu_list}) def add_students(request): if request.method = = 'GET' : cs_list = models.Classes.objects. all () return render(request, 'add_students.html' ,{ 'cs_list' :cs_list}) elif request.method = = 'POST' : u = request.POST.get( 'username' ,'') a = request.POST.get( 'age' ,'') g = request.POST.get( 'gender' ,'') c = request.POST.get( 'cs' ,'') models.Students.objects.create( username = u, age = a, gender = g, cs_id = c ) return redirect( '/students.html' ) def del_students(request): nid = request.GET.get( 'nid' , '') models.Students.objects. filter ( id = nid).delete() return redirect( '/students.html' ) def edit_students(request): if request.method = = "GET" : nid = request.GET.get( 'nid' , '') obj = models.Students.objects.get( id = nid) cs_list = models.Classes.objects. all () return render(request, 'edit_students.html' ,{ 'obj' :obj, 'cs_list' :cs_list}) elif request.method = = "POST" : nid = request.POST.get( 'nid' ,'') u = request.POST.get( 'username' , '') a = request.POST.get( 'age' , '') g = request.POST.get( 'gender' , '') c = request.POST.get( 'cs' , '') models.Students.objects. filter ( id = nid).update( username = u, age = a, gender = g, cs_id = c) return redirect( '/students.html' ) |
2.在urls.py 中配置url路由:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | from django.contrib import admin from django.urls import path from app01.views import classes,students,teachers urlpatterns = [ path( 'admin/' , admin.site.urls), path( 'classes.html' , classes.get_classes), path( 'add_classes.html' , classes.add_classes), path( 'del_classes.html' , classes.del_classes), path( 'edit_classes.html' , classes.edit_classes), path( 'students.html' , students.get_students), path( 'add_students.html' , students.add_students), path( 'del_students.html' , students.del_students), path( 'edit_students.html' , students.edit_students), # path('teachers.html', teachers.get_teachers), ] |
3.在template目录下建立所需的html页面文件:
get_students.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | <!DOCTYPE html> <html lang = "en" > <head> <style> tr td{ border: 1px solid #000;text-align:center;} < / style> <meta charset = "UTF-8" > <title>Title< / title> < / head> <body> <div> <table> <thead> <tr> <th> ID < / th> <th>姓名< / th> <th>年龄< / th> <th>性别< / th> <th>班级< / th> <th>操作< / th> < / tr> < / thead> <tbody> { % for row in stu_list % } <tr> <td>{{ row. id }}< / td> <td>{{ row.username }}< / td> <td>{{ row.age }}< / td> <td>{{ row.gender }}< / td> <td>{{ row.cs.title }}< / td> <td><a href = "/del_students.html?nid={{ row.id }}" >删除< / a> |<a href = "/edit_students.html?nid={{ row.id }}" >编辑< / a> < / td> < / tr> { % endfor % } < / tbody> < / table> < / div> <div><a href = "/add_students.html" >添加< / a> < / div> < / body> < / html> |
add_students
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <! DOCTYPE html> < html lang="en"> < head > < meta charset="UTF-8"> < title >Title</ title > </ head > < body > < h1 >添加用户</ h1 > < form method="post" action="/add_students.html"> {% csrf_token %} < p >< input type="text" name="username" placeholder="用户名"></ p > < p >< input type="text" name="age" placeholder="年龄"></ p > < p > 男< input type="radio" name="gender" value="1"> 女< input type="radio" name="gender" value="0"> </ p > < p > < select name="cs"> {% for row in cs_list %} < option value="{{ row.id }}">{{ row.title }}</ option > {% endfor %} </ select > </ p > < p >< input type="submit" value="提交"></ p > </ form > </ body > </ html > |
edit_students.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <! DOCTYPE html> < html lang="en"> < head > < meta charset="UTF-8"> < title >Title</ title > </ head > < body > < h1 >编辑用户</ h1 > < form method="post" action="/edit_students.html"> {% csrf_token %} < input type="hidden" name="nid" value="{{ obj.id }}"> < p >< input type="text" name="username" placeholder="用户名"></ p > < p >< input type="text" name="age" placeholder="年龄"></ p > < p > 男< input type="radio" name="gender" value="1"> 女< input type="radio" name="gender" value="0"> </ p > < p > < select name="cs"> {% for row in cs_list %} < option value="{{ row.id }}">{{ row.title }}</ option > {% endfor %} </ select > </ p > < p >< input type="submit" value="提交"></ p > </ form > </ body > </ html > |
7.学员管理系统之给班级分配老师:
在teachers数据表中增加一些老师信息:
在pycharm右上角的Database打开面板,然后将template目录下边的db.splte3鼠标拖入到Database面板中,打开db==》app01_teachers表
点击“+”,然后填入老师信息,然后点击有“DB”标志的向上箭头,进行数据保存。
1.在classes.py中增加set_teachers函数
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | def set_teachers(request): if request.method = = 'GET' : nid = request.GET.get( 'nid' ,'') cls_obj = models.Classes.objects.get( id = nid) cls_teacher_list = cls_obj.a. all () all_teacher_list = models.Teachers.objects. all () return render(request, 'set_teachers.html' ,{ 'cls_teacher_list' :cls_teacher_list, 'all_teacher_list' :all_teacher_list, 'nid' :nid, }) elif request.method = = 'POST' : nid = request.POST.get( 'nid' , '') ids_str = request.POST.getlist( 'teacher_id' ,'') ids_int = [] for i in ids_str: i = int (i) ids_int.append(i) obj = models.Classes.objects.get( id = nid) obj.a. set (ids_int) return redirect( '/classes.html' ) |
2.在urls.py 中配置url路由:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | from django.contrib import admin from django.urls import path from app01.views import classes,students,teachers urlpatterns = [ path( 'admin/' , admin.site.urls), path( 'classes.html' , classes.get_classes), path( 'add_classes.html' , classes.add_classes), path( 'del_classes.html' , classes.del_classes), path( 'edit_classes.html' , classes.edit_classes), path( 'students.html' , students.get_students), path( 'add_students.html' , students.add_students), path( 'del_students.html' , students.del_students), path( 'edit_students.html' , students.edit_students), path( 'set_teachers.html' , classes.set_teachers), ] |
3.在template目录下建立所需的html页面文件:
set_teachers.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <!DOCTYPE html> <html lang = "en" > <head> <meta charset = "UTF-8" > <title>Title< / title> < / head> <body> <form action = "/set_teachers.html" method = "post" > < input type = "hidden" name = "nid" value = "{{ nid }}" > { % csrf_token % } <select multiple size = "10" name = "teacher_id" > { % for item in all_teacher_list % } { % if item in cls_teacher_list % } <option value = "{{ item.id }}" selected = "selected" >{{ item.name }}< / option> { % else % } <option value = "{{ item.id }}" >{{ item.name }}< / option> { % endif % } { % endfor % } < / select> < input type = "submit" value = "提交" > < / form> < / body> < / html> |
对get_classes.html进行增添修改为:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div> <table border="1"> <thead> <tr> <th>ID</th> <th>名称</th> <th>任课老师</th> <th>操作</th> </tr> </thead> <tbody> {% for row in cls_list %} <tr> <td>{{ row.id }}</td> <td>{{ row.title }}</td> <td> {% for item in row.a.all %} <span>{{ item.name }}</span> {% endfor %} </td> <td><a href="/del_classes.html?nid={{ row.id }}">删除</a> |<a href="/edit_classes.html?nid={{ row.id }}">编辑</a> |<a href="/set_teachers.html?nid={{ row.id }}">分配老师</a> </td> </tr> {% endfor %} </tbody> </table> </div> <div><a href="/add_classes.html">添加</a> </div> </body> </html>
8.初识Ajax
Ajax是异步传输方式,偷偷的向后台发请求,不引起页面刷新,下面通过一个小例子来认识Ajax这种数据传输方式。
首先下载jQuery导入项目下的static目录下
1.在app01/Views目录下新建ajax.py
from django.shortcuts import render,redirect,HttpResponse def ajax1(request): return render(request,'ajax1.html') def ajax2(request): u=request.GET.get('username') p=request.GET.get('password') return HttpResponse('我愿意')
2.在urls.py中配置相关路由
from django.contrib import admin from django.urls import path from app01.views import classes,students,teachers,ajax urlpatterns = [ path('admin/', admin.site.urls), path('classes.html', classes.get_classes), path('add_classes.html', classes.add_classes), path('del_classes.html', classes.del_classes), path('edit_classes.html', classes.edit_classes), path('students.html', students.get_students), path('add_students.html', students.add_students), path('del_students.html', students.del_students), path('edit_students.html', students.edit_students), path('set_teachers.html', classes.set_teachers), path('ajax1.html', ajax.ajax1), path('ajax2.html', ajax.ajax2), ]
3.在template目录下新建ajax1.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .btn{ display: inline-block; padding: 5px 15px; background-color: coral; color: white; cursor: pointer; } </style> </head> <body> <div> <input placeholder="用户名" type="text" id="username"> <input placeholder="密码" type="password" id="password"> <div class="btn" onclick="submitForm();">提交</div> </div> <script src="/static/jquery-3.3.1.js"></script> <script> function submitForm() { var u=$('#username').val(); var p=$('#password').val(); $.ajax({ url:'ajax2.html', type:'GET', data:{username:u,password:p}, success:function (arg) { //回调函数 arg是服务器返回的字符串 console.log(arg) } }) } </script> </body> </html>
9.学员管理系统之Ajax删除学员:
1.在ajax.py中增加ajax4函数
from app01 import models def ajax4(request): nid=request.GET.get('nid') msg='成功' try: models.Students.objects.get(id=nid).delete() except Exception as e: msg=str(e) return HttpResponse(msg)
2.在urls.py中配置相关路由
from django.contrib import admin from django.urls import path from app01.views import classes,students,teachers,ajax urlpatterns = [ path('admin/', admin.site.urls), path('classes.html', classes.get_classes), path('add_classes.html', classes.add_classes), path('del_classes.html', classes.del_classes), path('edit_classes.html', classes.edit_classes), path('students.html', students.get_students), path('add_students.html', students.add_students), path('del_students.html', students.del_students), path('edit_students.html', students.edit_students), path('set_teachers.html', classes.set_teachers), path('ajax1.html', ajax.ajax1), path('ajax2.html', ajax.ajax2), path('ajax4.html', ajax.ajax4), ]
3.对get_students.html进行添加修改:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div> <table border="1"> <thead> <tr> <th>ID</th> <th>姓名</th> <th>年龄</th> <th>性别</th> <th>班级</th> <th>操作</th> </tr> </thead> <tbody> {% for row in stu_list %} <tr nid="{{ row.id }}"> <td>{{ row.id }}</td> <td>{{ row.username }}</td> <td>{{ row.age }}</td> <td>{{ row.gender }}</td> <td>{{ row.cs.title }}</td> <td><a href="/del_students.html?nid={{ row.id }}">删除</a> |<a onclick="removeStudent(this);" href="#">Ajax删除</a> |<a href="/edit_students.html?nid={{ row.id }}">编辑</a> </td> </tr> {% endfor %} </tbody> </table> </div> <div><a href="/add_students.html">添加</a> </div> </body> <script src="/static/jquery-3.3.1.js"></script> <script> function removeStudent(ths) { var nid=$(ths).parent().parent().attr('nid'); $.ajax({ url:'/ajax4.html', type:'GET', data:{nid:nid}, success:function (arg) { if (arg=='成功'){ window.location.reload(); }else{ alert(arg); } } }) } </script> </html>