1、后台代码:
from django.shortcuts import render from HelloWorld import mssqlDB from django.http import HttpResponse from django.views.decorators.csrf import csrf_exempt import json from HelloWorld import pager db = mssqlDB.MSSQL() # Create your views here. def blog_index(request): #ms = mssqlDB.MSSQL(host="10.10.15.55",user="sa",pwd="Aa123456",db="testDB") #resList = ms.GetQuery("select * from tUsers") blog_list = db.GetQuery("select * from tUsers") # 获取所有数据 #test=json.dumps(blog_list) return render(request,'index.html', {'blog_list':blog_list}) # 返回index.html #视图-添加用户 def blog_Add_V(request): return render(request,'add.html') #视图-分页 def pagelist(request): pagenum = request.GET.get('page') if pagenum == None: pagenum = 1 #获取数据集合 datalist = db.GetQueryPage("""select * from (select ROW_NUMBER() OVER (order by id desc )AS RowNumber,* from tUsers) as temp where RowNumber between 10*({0}-1) and 10*{0};SELECT COUNT(1) total FROM tUsers""".format(pagenum)) all_count = datalist.get("datapage")[0].get("total") # 获取要显示数据库的总数据条数 page_info = pager.PageInfo(request.GET.get('page'), all_count, 'pagelist.htm',) print(page_info.start_data()) #page_info.pager() # 利用分页对象获取当前页显示数据 return render(request, 'pagelist.html', {'page_info': page_info,'datalist':datalist}) #DB-添加用户 @csrf_exempt #增加装饰器,作用是跳过 csrf 中间件的保护 def blog_Add_DB(request): sql="" if request.POST: sql = "INSERT INTO tUsers(name,age) VALUES('%s',%s)"%(request.POST['xingMing'],request.POST['nianLing']) else: sql = "INSERT INTO tUsers(name,age) VALUES('%s',%s)"%(request.GET['xingMing'],request.GET['nianLing']) print(sql) ret = db.ExecQuery(sql) if ret > 0: return HttpResponse('操作成功') else: return HttpResponse('操作失败') #删除数据 def blog_Del_DB(request): sql = "delete from tUsers where id={}".format(request.GET['id']) ret = db.ExecQuery(sql) if ret > 0: return HttpResponse('操作成功') else: return HttpResponse('操作失败')
(1)sql帮助类-mssqlDB.py:https://www.cnblogs.com/guangang/articles/9258683.html
(2)分页模板类-pager.py:https://www.cnblogs.com/guangang/articles/9258773.html
2、查询列表代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>分页组件</title> {# 引入bootstrap样式#} <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> </head> <body> <div style="margin:3%"> <h1 style="float:right"><a type="button" class="btn btn-primary" href="/add.htm">添加</a></h1> <table class="table table-striped table-condensed table-bordered"> <tr class="table title" style="font-weight:600; text-align:left"> <td>序号</td> <td>编号</td> <td>姓名</td> <td>年龄</td> <td>操作</td> </tr> {% for blog in datalist.datalist %} <tr> <td>{{blog.RowNumber}}</td> <td>{{blog.id}}</td> <td>{{blog.name}}</td> <td>{{blog.age}}</td> <td><button type="button" class="btn btn-danger" οnclick="optdel({{blog.id}})">删除</button></td> </tr> {% endfor %} </table> {#分页#} <nav aria-label="Page navigation"> <ul class="pagination"> {# 传入page_info.pager#} {{ page_info.pager|safe }} </ul> </nav> </div> </body> </html> <script> function optdel(id){ if(window.confirm('你确定要删除吗?')){ $.get("/optdel",{"id":id}, function(ret){ alert(ret); location.reload(); }) } } </script>
3、添加功能代码:
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! --> <meta name="description" content=""> <meta name="author" content=""> <title>Starter Template for Bootstrap</title> <!-- Bootstrap core CSS --> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="starter-template.css" rel="stylesheet"> </head> <body> <nav class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">W</a> </div> <div id="navbar" class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="/index.htm">Home</a></li> <li><a href="#about">About</a></li> <li><a href="#contact">Contact</a></li> </ul> </div><!--/.nav-collapse --> </div> </nav> <div class="container" style="margin-top: 50px;"> <br><br> <div class="starter-template"> <form> <div class="form-group"> <label for="xingMing">姓名</label> <input type="text" class="form-control" id="xingMing" name="xingMing"> </div> <div class="form-group"> <label for="nianLing">年龄</label> <input type="text" class="form-control" id="nianLing" name="nianLing"> </div> <button type="button" class="btn btn-default" οnclick="AddUser()">添加用户</button> </form> </div> </div><!-- /.container --> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script> //添加客户 function AddUser(){ var xingMing=$("#xingMing").val(); if(xingMing==""){ alert("请填写姓名!");return; } var nianLing=$("#nianLing").val(); if(nianLing==""){ alert("请填写年龄!");return; } $.post("/add",{"xingMing":xingMing,"nianLing":nianLing}, function(ret){ alert(ret); }) } </script> </body> </html>
4、url配置:
from django.contrib import admin from django.urls import path from Web import views urlpatterns = [ path('add', views.blog_Add_DB), path('optdel', views.blog_Del_DB), path('pagelist.htm', views.pagelist), ]