基于Python Django框架+jquery Ajax技术实现的增删改查（CRUD）+Ajax的异步文件上传

运行结果

运行之后的index界面，有登陆、注册功能

1

登陆界面，输入数据库中用户名、密码不为空且密码是加密的数据，可以记住密码，需在输入前点击，保存为加密后的密码，进入main界面

在这里插入图片描述

注册界面，用的bootstrop的弹窗，用户名和密码不能为空，可传富文本与图片和日期，向数据库中添加新用户（即数据增加）

在这里插入图片描述

main界面，登入之后的样子，可点击系统功能管理下的用户管理，进行删除、修改、查询

在这里插入图片描述

用户管理界面，可进行删、改、查操作，并具有分页，部门属性是三级联查（注：性别查询用1和2代表男和女）

在这里插入图片描述

代码实现

首先在pycharm工具中新建django框架的文件，自动生成几个文件，然后在右上角的Edit Configuratrons中的Parameters加上runserver以保障可以直接运行而不用在控制台打印，接着，配置setting文件，详细在下面说，然后通过在控制台输入语句“python manage.py startapp shopapp”新建shopapp类，然后有两种方法进行sql语句的编写，一种是通过自己手写dao层和servise层的代码，另一种是在控制台输入语句"python manage.py inspectdb"复制到models层，然后在admin文件中声明即可，具体代码如下。

自生成的

在这里插入图片描述
其中服务器文件wsgi.py不用改动，启动文件manage.py不用改动，在settings.py中加入“SESSION_ENGINE = ‘django.contrib.sessions.backends.cache’”，INSTALLED_APPS中加入“‘shopapp.apps.ShopappConfig’”，
将MIDDLEWARE中的“django.middleware.csrf.CsrfViewMiddleware”注释掉，DATABASES中的内容改成对应的数据库的内容，其中“‘OPTIONS’:{‘isolation_level’:None}”的作用是忽略版本号，避免不支持，最后，加上

STATICFILES_DIRS = (
    os.path.join(BASE_DIR,"static"),
)

# 配置输出sql语句
LOGGING = {
    'version': 1,
    'disable_existing_loggers': False,
    'handlers': {
        'console':{
            'level':'DEBUG',
            'class':'logging.StreamHandler',
        },
    },
    'loggers': {
        'django.db.backends': {
            'handlers': ['console'],
            'propagate': True,
            'level':'DEBUG',
        },
    }
}

然后，url.py中对应的是shopapp.views中的方法和接口。

from django.contrib import admin
from django.urls import path
from shopapp.views import *

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index),
    path('gologin/', goLogin),
    path('login/', login),
    path('logout/', logout),
    path('regist.do', regist),
    path('upload.do', uploadFile),
    path('goajaxjobtaskinfo/', goJobTaskInfo),
    path('ajaxjobtaskinfo/', getJobTaskInfo),
    path('ajaxjobsalary/', getJobSalary),
    path('goajaxuserinfo/', goAjaxUserInfo),
    path('ajaxuserinfo/', getUserInfo),
    path('ajaxdeptinfo/', getDeptList)
]

shopapp生成的

在这里插入图片描述
其中，init.py为空，apps.py不用修改，tests.py不用修改，models通过在控制台输入“python manage.py inspectdb”获取相应的建表的语句，在admin.py中进行调用相关的sql语句，views作用同flask中dcontroller的作用，进行数据处理以及增删改查。
views.py

from django.shortcuts import render,redirect
from django.http.response import HttpResponse
from shopapp.service.userservice import UserService
from shopapp.service.jobtaskservice import JobTaskService
from shopapp.entity.jobtask import JobTask
import json
import hashlib
from .models import TUser
from .models import JobDept
from django.core import serializers
import os
from datetime import datetime

# Create your views here.
userService = UserService()
jobTaskService = JobTaskService()

def index(request):
    return render(request, 'index.html')
    pass

def goLogin(request):
    return render(request, 'login.html')
    pass

def login(request):
    userName = request.POST.get('userName')
    userPwd = request.POST.get('userPwd')
    remeberMe = request.POST.get('rememberMe')

    result = userService.findUserByUserName(userName)
    isLogin = False
    if result and (remeberMe == None or remeberMe == 'false'):
        if result[0][2] == hashlib.md5(userPwd.encode(encoding='utf-8')).hexdigest():
            isLogin = True
            pass
    elif result and remeberMe == 'true':
        if result[0][2] == userPwd:
            isLogin = True
            pass
        pass

    if isLogin:
        userItem = {}
        userItem['userId'] = result[0][0]
        userItem['userName'] = result[0][1]
        userItem['userPic'] = result[0][9]
        userItem['userRole'] = result[0][10]
        request.session['user'] = userItem
        response = render(request, 'main.html')
        if remeberMe == 'false':
            response.set_cookie('userName', userName)
            response.set_cookie('userPwd', result[0][2])
            response.set_cookie('rememberMe', 'true')
            pass
        elif remeberMe == None:
            response = render(request, 'main.html')
            response.delete_cookie('userName')
            response.delete_cookie('userPwd')
            response.delete_cookie('rememberMe')
            pass

        return response
    else:
        return render(request, 'login.html')
    pass

def regist(request):
    userDict = json.loads(request.body.decode('utf-8'))
    '''
    user = TUser()
    user.user_name = userDict.get('userName')  # 表单提交的数据使用request.form[]
    user.user_pwd = hashlib.md5((userDict.get('userPwd')).encode(encoding='utf-8')).hexdigest()
    user.user_pic = userDict.get('userPic')
    user.user_birth = datetime.strptime(userDict.get('userBirth'), '%Y-%m-%d')
    user.user_sex = userDict.get('userSex')
    user.user_intro = userDict.get('userIntro')
    result = user.save()
    '''
    result = TUser.objects.create(
        user_name = userDict.get('userName'),
        user_pwd=hashlib.md5((userDict.get('userPwd')).encode(encoding='utf-8')).hexdigest(),
        user_pic=userDict.get('userPic'),
        user_birth=datetime.strptime(userDict.get('userBirth'), '%Y-%m-%d'),
        user_sex=userDict.get('userSex'),
        user_intro=userDict.get('userIntro')
    )
    if result:
        result = 1
    else:
        result = 0
    return HttpResponse(json.dumps({'result': result}), content_type="application/json")
    pass

def logout(request):
    request.session.flush()
    return render(request, 'login.html')
    pass

def goJobTaskInfo(request):
    return render(request, "jobinfo/jobtaskinfo.html")
    pass

def getJobTaskInfo(request):
    jobTaskData = request.body.decode('utf-8')
    jobTaskDict = json.loads(jobTaskData)
    tData = {}

    jobTask = JobTask()
    jobTask.taskTitle = jobTaskDict.get('taskTitle')
    jobTask.taskURL = jobTaskDict.get('taskURL')

    currentPage = int(jobTaskDict.get('currentPage'))
    pageSize = int(jobTaskDict.get('pageSize'))
    opr = jobTaskDict.get('opr')
    taskId = int(jobTaskDict.get('taskId'))
    jobTask.taskId = taskId

    updateResult = 0
    if opr == 'del':
        updateResult = jobTaskService.removeJobTask(taskId)
        pass
    elif opr == 'update':
        tTask = jobTaskService.findJobTaskByJobTaskId(taskId)
        tData['taskId'] = tTask.taskId
        tData['taskTitle'] = tTask.taskTitle
        tData['taskURL'] = tTask.taskURL
        returnData = {'code': 1, 'jobTaskData': tData, 'pageSize': pageSize, 'currentPage': currentPage, 'opr':'update'}

        return HttpResponse(json.dumps(returnData), content_type="application/json")
    elif opr == 'submitUpdate':
        updateResult = jobTaskService.updateJobTask(jobTask)
        pass

    result = jobTaskService.findPageJobTaskList(jobTask, pageSize, currentPage)
    counts = jobTaskService.countJobTasks(jobTask)
    totalPage = 0

    if(counts%pageSize == 0):
        totalPage = counts//pageSize
    else:
        totalPage = counts // pageSize + 1
        pass

    returnData = {'code':1, 'jobTaskData':result, 'pageSize':pageSize, 'currentPage':currentPage, 'totalPage':totalPage, 'updateResult':updateResult, 'opr':'search','counts':counts}

    return HttpResponse(json.dumps(returnData), content_type="application/json")
    pass

def getJobSalary(request):
    result = jobTaskService.findJobMeanSalary()
    returnData = {'code':1, 'salary':result}
    r = json.dumps(returnData)
    return HttpResponse(json.dumps(returnData), content_type="application/json")
    pass



def goAjaxUserInfo(request):
    return render(request, "systeminfo/userinfo.html")
    pass

def getUserInfo(request):
    userData = request.body.decode('utf-8')
    userDict = json.loads(userData)
    tData = {}

    user = TUser()
    user.user_name = userDict.get('userName')
    user.user_sex = userDict.get('userSex')

    currentPage = int(userDict.get('currentPage'))
    pageSize = int(userDict.get('pageSize'))
    opr = userDict.get('opr')
    userId = int(userDict.get('userId'))
    user.user_id= userId
    user.jobDept_id = int(userDict.get('userDeptId'))

    updateResult = 0
    if opr == 'del':
        updateResult = user.delete()
        pass
    elif opr == 'update':
        tUser = TUser.objects.filter(user_id=userId).values('user_id', 'user_name', 'user_sex', 'jobDept_id', 'jobDept__dept_name')
        tData['userId'] = tUser[0].get('user_id')
        tData['userName'] = tUser[0].get('user_name')
        tData['userSex'] = tUser[0].get('user_sex')
        tData['userDeptId'] = tUser[0].get('jobDept_id')
        tData['userDeptName'] = tUser[0].get('jobDept__dept_name')
        returnData = {'code': 1, 'userData': tData, 'pageSize': pageSize, 'currentPage': currentPage, 'opr':'update'}

        return HttpResponse(json.dumps(returnData), content_type="application/json")
    elif opr == 'submitUpdate':
        currentPage = 1
        updateResult = TUser.objects.filter(user_id=userId).update(user_sex=user.user_sex, jobDept_id=user.jobDept_id)
        pass
    query = TUser.objects
    if user.user_name:
        query = query.filter(user_name__contains=user.user_name)
    if user.user_sex:
        query = query.filter(user_sex=user.user_sex)
        pass

    startRow =  (currentPage - 1)*pageSize
    endRow  = currentPage*pageSize
    result = query.values('user_id', 'user_name', 'user_sex', 'jobDept__dept_name')[startRow:endRow]  # 会生成 LIMIT 2 OFFSET 1

    counts = query.count()

    totalPage = 0
    if(counts%pageSize == 0):
        totalPage = counts//pageSize
    else:
        totalPage = counts // pageSize + 1
        pass

    # data = serializers.serialize("json", result, use_natural_foreign_keys=True)
    # data = json.loads(data)
    data = []
    for tempUser in result:
        dictItem = {'pk':tempUser.get('user_id')}
        fieldsItem ={'user_name':tempUser.get('user_name'), 'user_sex':tempUser.get('user_sex'), 'user_deptname':tempUser.get('jobDept__dept_name')}
        dictItem['fields'] = fieldsItem
        data.append(dictItem)
        pass
    '''
    for tempUser, tdata in zip(result, data):
        tdata['fields']['user_deptname'] = tempUser.jobDept.dept_name # 获取外键关联的时候，是第二次查询
        pass
    '''
    returnData = {'code':1, 'userData':data, 'pageSize':pageSize, 'currentPage':currentPage, 'totalPage':totalPage, 'updateResult':updateResult, 'opr':'search','counts':counts}

    return HttpResponse(json.dumps(returnData), content_type="application/json")
    pass

def getDeptList(request):
    parentId = int(request.GET.get('parentId'))
    if parentId ==0:
        result = JobDept.objects.filter(dept_parentid__isnull=True).all()
    else:
        result = JobDept.objects.filter(dept_parentid=parentId).all()
    data = serializers.serialize("json", result)
    data = json.loads(data)

    return HttpResponse(json.dumps({'code':1, 'data':data}), content_type="application/json")
    pass

def uploadFile(request):
    # 后缀需要检查的
    file = request.FILES.get('upload')
    if file:
        try:
            with open(os.path.dirname(__file__) + os.sep + '..' + os.sep + 'static' + os.sep + 'uploads'+ os.sep + file.name, "wb+") as fp:
                for chunk in file.chunks():
                    fp.write(chunk)
                    pass
        except Exception as e:
            return HttpResponse(json.dumps({'uploaded': 0, 'fileName': "", 'url': ""}), content_type="application/json")
            pass
        return  HttpResponse(json.dumps({'uploaded': 1, 'fileName':file.name, 'url': os.sep + 'static' + os.sep + 'uploads'+ os.sep + file.name}), content_type="application/json")
    else:
        return  HttpResponse(json.dumps({'uploaded': 0, 'fileName': "", 'url': ""}), content_type="application/json")
    pass

页面------与flask的区别是引用时，先写{% load static %}，在用{%…%}引用

js-----与flask一样

数据库及数据

在这里插入图片描述
通过下面的语句可以生成对应的数据库表以及数据

-- MySQL dump 10.13  Distrib 5.7.17, for Win64 (x86_64)
--
-- Host: 127.0.0.1    Database: db_test_shop1
-- ------------------------------------------------------
-- Server version	5.7.22

/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;
/*!40103 SET @OLD_TIME_ZONE=@@TIME_ZONE */;
/*!40103 SET TIME_ZONE='+00:00' */;
/*!40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */;
/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;

--
-- Table structure for table `t_user`
--

DROP TABLE IF EXISTS `t_user`;
/*!40101 SET @saved_cs_client     = @@character_set_client */;
/*!40101 SET character_set_client = utf8 */;
CREATE TABLE `t_user` (
  `USER_ID` int(11) NOT NULL AUTO_INCREMENT,
  `USER_NAME` varchar(32) NOT NULL,
  `USER_PWD` varchar(512) NOT NULL,
  `USER_AGE` int(11) DEFAULT NULL,
  `USER_SEX` int(11) DEFAULT NULL,
  `USER_QQ` int(11) DEFAULT NULL,
  `USER_CELLPHONE` varchar(20) DEFAULT NULL,
  `USER_MONEY` float DEFAULT NULL,
  `USER_STATUS` int(11) DEFAULT NULL,
  `USER_PIC` varchar(128) DEFAULT NULL,
  `USER_ROLE` int(11) DEFAULT '1',
  `JOBDEPT_ID` int(11) DEFAULT NULL,
  `USER_BIRTH` datetime DEFAULT NULL,
  `USER_INTRO` longtext,
  PRIMARY KEY (`USER_ID`),
  UNIQUE KEY `USER_NAME_UNIQUE` (`USER_NAME`),
  KEY `FK_deptid_idx` (`JOBDEPT_ID`),
  CONSTRAINT `FK_deptid` FOREIGN KEY (`JOBDEPT_ID`) REFERENCES `job_dept` (`dept_id`) ON DELETE CASCADE ON UPDATE NO ACTION
) ENGINE=InnoDB AUTO_INCREMENT=12 DEFAULT CHARSET=utf8;
/*!40101 SET character_set_client = @saved_cs_client */;

--
-- Dumping data for table `t_user`
--

LOCK TABLES `t_user` WRITE;
/*!40000 ALTER TABLE `t_user` DISABLE KEYS */;
INSERT INTO `t_user` VALUES (1,'zhangsan','e10adc3949ba59abbe56e057f20f883e',20,1,999888,'13400000111',999899,1,NULL,1,4,NULL,NULL),(2,'xiaojiejie','e10adc3949ba59abbe56e057f20f883e',21,2,999900,'13400000101',20000,1,NULL,1,1,NULL,NULL),(3,'xiaogege','e10adc3949ba59abbe56e057f20f883e',18,1,888900,'13400010001',999999,1,NULL,1,1,NULL,NULL),(4,'tom','e10adc3949ba59abbe56e057f20f883e',16,1,111111,'18800010001',10000,1,NULL,1,1,NULL,NULL),(5,'asdasd','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(6,'asdasdsd','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(7,'zczxsd','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(8,'bdfbdf','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(9,'nngdf','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(10,'ghnfbc','e10adc3949ba59abbe56e057f20f883e',NULL,1,NULL,NULL,NULL,NULL,NULL,1,1,NULL,NULL),(11,'ghmgm','e10adc3949ba59abbe56e057f20f883e',NULL,2,NULL,NULL,NULL,NULL,NULL,1,3,NULL,NULL);
/*!40000 ALTER TABLE `t_user` ENABLE KEYS */;
UNLOCK TABLES;
/*!40103 SET TIME_ZONE=@OLD_TIME_ZONE */;

/*!40101 SET SQL_MODE=@OLD_SQL_MODE */;
/*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */;
/*!40014 SET UNIQUE_CHECKS=@OLD_UNIQUE_CHECKS */;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;

-- Dump completed on 2019-10-20 17:55:54

以上，就是基于Python Django框架+jquery Ajax技术实现的增删改查（CRUD）+Ajax的异步文件上传的所有内容。并且，具体代码后续会上传。

版权声明：本文为weixin_44423698原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。