小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记

课程来源:

https://www.bilibili.com/video/BV1NL41157ph/?p=71&spm_id_from=333.880.my_history.page.click

课程链接与学习资料推荐

django入门课程

https://www.bilibili.com/video/BV1NL41157ph/?p=71&spm_id_from=333.880.my_history.page.click

django入门项目开发

任务管理平台:https://www.bilibili.com/video/BV1uA411b77M

django进阶项目(增删改查、权限)

https://space.bilibili.com/283478842/channel/detail?cid=91596&ctype=0

前后端分离的项目: django + drf框架 + vue.js

https://www.bilibili.com/video/BV1ZE411j7RK

前端基础

https://www.bilibili.com/video/BV1QE411j7bV?spm_id_from=333.999.0.0

项目部署

新建django项目

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第1张图片
小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第2张图片

创建app

python manage.py startapp app01

注册app

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第3张图片

数据库配置

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第4张图片

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'gx_day16',  # 数据库名字
        'USER': 'root',
        'PASSWORD': 'root123',
        'HOST': '127.0.0.1',  # 那台机器安装了MySQL
        'PORT': 3306,
    }
}

等价于建表语句:

create database gx_day16 DEFAULT CHARSET utf8 COLLATE utf8_general_ci;

数据库表格创建

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第5张图片
小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第6张图片

from django.db import models


class Department(models.Model):
    """ 部门表 """
    title = models.CharField(verbose_name='标题', max_length=32)


class UserInfo(models.Model):
    """ 员工表 """
    name = models.CharField(verbose_name="姓名", max_length=16)
    password = models.CharField(verbose_name="密码", max_length=64)
    age = models.IntegerField(verbose_name="年龄")
    account = models.DecimalField(verbose_name="账户余额", max_digits=10, decimal_places=2, default=0)
    create_time = models.DateTimeField(verbose_name="入职时间")

    # 无约束
    # depart_id = models.BigIntegerField(verbose_name="部门ID")
    # 1.有约束
    #   - to,与那张表关联
    #   - to_field,表中的那一列关联
    # 2.django自动
    #   - 写的depart
    #   - 生成数据列 depart_id
    # 3.部门表被删除
    # ### 3.1 级联删除
    depart = models.ForeignKey(to="Department", to_field="id", on_delete=models.CASCADE)
    # ### 3.2 置空
    # depart = models.ForeignKey(to="Department", to_field="id", null=True, blank=True, on_delete=models.SET_NULL)

    # 在django中做的约束
    gender_choices = (
        (1, "男"),
        (2, "女"),
    )
    gender = models.SmallIntegerField(verbose_name="性别", choices=gender_choices)

django为数据库自动建表

python manage.py makemigrations
python manage.py migrate

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第7张图片
建表成功
小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第8张图片

静态文件管理

小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第9张图片

django实例

模板继承

定义模版:layout.html

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
    <link rel="stylesheet" href="{% static 'plugin...min.css' %}">
    {% block css %}{% endblock %}
head>
<body>
    <h1>标题h1>
    <div>
        {% block content %}{% endblock %}
    div>
    <h1>底部h1>
    
    <script src="{% static 'js/jquery-3.6.0.min.js' %}">script>
    {% block js %}{% endblock %}
body>
html>

继承模版:

{% extends 'layout.html' %}

{% block css %}
	<link rel="stylesheet" href="{% static 'pluxxx.css' %}">
	<style>
		...
	style>
{% endblock %}


{% block content %}
    <h1>首页h1>
{% endblock %}


{% block js %}
	<script src="{% static 'js/jqxxxin.js' %}">script>
{% endblock %}

Form表单

views.py

class MyForm(Form):
    user = forms.CharField(widget=forms.Input)
    pwd = form.CharFiled(widget=forms.Input)
    email = form.CharFiled(widget=forms.Input)
    account = form.CharFiled(widget=forms.Input)
    create_time = form.CharFiled(widget=forms.Input)
    depart = form.CharFiled(widget=forms.Input)
    gender = form.CharFiled(widget=forms.Input)


def user_add(request):
    if request.method == "GET":
        form = MyForm()
        return render(request, 'user_add.html',{"form":form})

user_add.html(用户添加业务html文件)
普通写法:

<form method="post">
    {% for field in form%}
    	{{ field }}
    {% endfor %}
    
form>

简便写法:

<form method="post">
    {{ form.user }}
    {{ form.pwd }}
    {{ form.email }}
    
form>

ModelForm表单

models.py

class UserInfo(models.Model):
    """ 员工表 """
    name = models.CharField(verbose_name="姓名", max_length=16)
    password = models.CharField(verbose_name="密码", max_length=64)
    age = models.IntegerField(verbose_name="年龄")
    account = models.DecimalField(verbose_name="账户余额", max_digits=10, decimal_places=2, default=0)
    create_time = models.DateTimeField(verbose_name="入职时间")
    depart = models.ForeignKey(to="Department", to_field="id", on_delete=models.CASCADE)
    gender_choices = (
        (1, "男"),
        (2, "女"),
    )
    gender = models.SmallIntegerField(verbose_name="性别", choices=gender_choices)

views.py

class MyForm(ModelForm):
    xx = form.CharField*("...")
    class Meta:
        model = UserInfo
        fields = ["name","password","age","xx"]


def user_add(request):
    if request.method == "GET":
        form = MyForm()
        return render(request, 'user_add.html',{"form":form})

user_add.html
一般写法

<form method="post">
    {% for field in form%}
    	{{ field }}
    {% endfor %}
    
form>

简便写法

<form method="post">
    {{ form.user }}
    {{ form.pwd }}
    {{ form.email }}
    
form>

数据库筛选

# [obj,obj,obj]
queryset = models.PrettyNum.objects.filter(mobile="1888888888")

obj = models.PrettyNum.objects.filter(mobile="1888888888").first()

# True/False
exists = models.PrettyNum.objects.filter(mobile="1888888888").exists()

#排除自己以外,其他的数据是否手机号是否重复?

# id!=2 and mobile='1888888888'
models.PrettyNum.objects.filter(mobile="1888888888").exclude(id=2)
models.PrettyNum.objects.filter(mobile="19999999991",id=12)

data_dict = {"mobile":"19999999991","id":123}
models.PrettyNum.objects.filter(**data_dict)
models.PrettyNum.objects.filter(id=12)       # 等于12
models.PrettyNum.objects.filter(id__gt=12)   # 大于12
models.PrettyNum.objects.filter(id__gte=12)  # 大于等于12
models.PrettyNum.objects.filter(id__lt=12)   # 小于12
models.PrettyNum.objects.filter(id__lte=12)  # 小于等于12

data_dict = {"id__lte":12}
models.PrettyNum.objects.filter(**data_dict)
models.PrettyNum.objects.filter(mobile="999")               # 等于
models.PrettyNum.objects.filter(mobile__startswith="1999")  # 筛选出以1999开头
models.PrettyNum.objects.filter(mobile__endswith="999")     # 筛选出以999结尾
models.PrettyNum.objects.filter(mobile__contains="999")     # 筛选出包含999

data_dict = {"mobile__contains":"999"}
models.PrettyNum.objects.filter(**data_dict)

分页操作

分页逻辑

queryset = models.PrettyNum.objects.all()

queryset = models.PrettyNum.objects.filter(id=1)[0:10]


# 第1页
queryset = models.PrettyNum.objects.all()[0:10]

# 第2页
queryset = models.PrettyNum.objects.all()[10:20]

# 第3页
queryset = models.PrettyNum.objects.all()[20:30]

bootstrap分页封装

from django.utils.safestring import mark_safe
class Pagination(object):

    def __init__(self, request, queryset, page_size=10, page_param="page", plus=5):
        """
        :param request: 请求的对象
        :param queryset: 符合条件的数据(根据这个数据给他进行分页处理)
        :param page_size: 每页显示多少条数据
        :param page_param: 在URL中传递的获取分页的参数,例如:/etty/list/?page=12
        :param plus: 显示当前页的 前或后几页(页码)
        """

        from django.http.request import QueryDict
        import copy
        query_dict = copy.deepcopy(request.GET)
        query_dict._mutable = True
        self.query_dict = query_dict

        self.page_param = page_param
        page = request.GET.get(page_param, "1")

        if page.isdecimal():
            page = int(page)
        else:
            page = 1

        self.page = page
        self.page_size = page_size

        self.start = (page - 1) * page_size
        self.end = page * page_size

        self.page_queryset = queryset[self.start:self.end]

        total_count = queryset.count()
        total_page_count, div = divmod(total_count, page_size)
        if div:
            total_page_count += 1
        self.total_page_count = total_page_count
        self.plus = plus

    def html(self):
        # 计算出,显示当前页的前5页、后5页
        if self.total_page_count <= 2 * self.plus + 1:
            # 数据库中的数据比较少,都没有达到11页。
            start_page = 1
            end_page = self.total_page_count
        else:
            # 数据库中的数据比较多 > 11页。

            # 当前页<5时(小极值)
            if self.page <= self.plus:
                start_page = 1
                end_page = 2 * self.plus + 1
            else:
                # 当前页 > 5
                # 当前页+5 > 总页面
                if (self.page + self.plus) > self.total_page_count:
                    start_page = self.total_page_count - 2 * self.plus
                    end_page = self.total_page_count
                else:
                    start_page = self.page - self.plus
                    end_page = self.page + self.plus

        # 页码
        page_str_list = []

        self.query_dict.setlist(self.page_param, [1])
        page_str_list.append('
  • 首页
  • '
    .format(self.query_dict.urlencode())) # 上一页 if self.page > 1: self.query_dict.setlist(self.page_param, [self.page - 1]) prev = '
  • 上一页
  • '
    .format(self.query_dict.urlencode()) else: self.query_dict.setlist(self.page_param, [1]) prev = '
  • 上一页
  • '
    .format(self.query_dict.urlencode()) page_str_list.append(prev) # 页面 for i in range(start_page, end_page + 1): self.query_dict.setlist(self.page_param, [i]) if i == self.page: ele = '
  • {}
  • '
    .format(self.query_dict.urlencode(), i) else: ele = '
  • {}
  • '
    .format(self.query_dict.urlencode(), i) page_str_list.append(ele) # 下一页 if self.page < self.total_page_count: self.query_dict.setlist(self.page_param, [self.page + 1]) prev = '
  • 下一页
  • '
    .format(self.query_dict.urlencode()) else: self.query_dict.setlist(self.page_param, [self.total_page_count]) prev = '
  • 下一页
  • '
    .format(self.query_dict.urlencode()) page_str_list.append(prev) # 尾页 self.query_dict.setlist(self.page_param, [self.total_page_count]) page_str_list.append('
  • 尾页
  • '
    .format(self.query_dict.urlencode())) search_string = """
  • """
    page_str_list.append(search_string) page_string = mark_safe("".join(page_str_list)) return page_string

    分页组件使用

    视图函数页面:

    # 自定义的分页组件,以后如果想要使用这个分页组件,你需要做如下几件事:
    
    # 在视图函数中:
        def pretty_list(request):
    
            # 1.根据自己的情况去筛选自己的数据
            queryset = models.PrettyNum.objects.all()
    
            # 2.实例化分页对象
            page_object = Pagination(request, queryset)
    
            context = {
                "queryset": page_object.page_queryset,  # 分完页的数据
                "page_string": page_object.html()       # 生成页码
            }
            return render(request, 'pretty_list.html', context)
    

    HTML页面:

        {% for obj in queryset %}
            {{obj.xx}}
        {% endfor %}
    
        <ul class="pagination">
            {{ page_string }}
        ul>
    

    时间插件

    <link rel="stylesheet" href="static/plugins/bootstrap-3.4.1/css/bootstrap.css">
    <link rel="stylesheet" href="static/plugins/bootstrap-datepicker/css/bootstrap-datepicker.css">
    
    
    <input type="text" id="dt" class="form-control" placeholder="入职日期">
    
    
    
    <script src="static/js/jquery-3.6.0.min.js">script>
    <script src="static/plugins/bootstrap-3.4.1/js/bootstrap.js">script>
    <script src="static/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js">script>
    <script src="static/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js">script>
    
    
    <script>
        $(function () {
            $('#dt').datepicker({
                format: 'yyyy-mm-dd',
                startDate: '0',
                language: "zh-CN",
                autoclose: true
            });
    
        })
    script>
    

    ModelForm和BootStrap

    form中之间添加属性

    class UserModelForm(forms.ModelForm):
        class Meta:
            model = models.UserInfo
            fields = ["name", "password",]
            widgets = {
                "name": forms.TextInput(attrs={"class": "form-control"}),
                "password": forms.PasswordInput(attrs={"class": "form-control"}),
                "age": forms.TextInput(attrs={"class": "form-control"}),
            }
    
    class UserModelForm(forms.ModelForm):
        name = forms.CharField(
            min_length=3,
            label="用户名",
            widget=forms.TextInput(attrs={"class": "form-control"})
        )
    
        class Meta:
            model = models.UserInfo
            fields = ["name", "password", "age"]
    
    {{form.name}}      BootStrap的input框
    {{form.password}}  BootStrap的input框
    
    

    重新定义init方法批量设置

    class UserModelForm(forms.ModelForm):
        class Meta:
            model = models.UserInfo
            fields = ["name", "password", "age",]
    
        def __init__(self, *args, **kwargs):
            super().__init__(*args, **kwargs)
            
            # 循环ModelForm中的所有字段,给每个字段的插件设置
            for name, field in self.fields.items():
    			field.widget.attrs = {
                    "class": "form-control", 
                    "placeholder": field.label
                }
    
    class UserModelForm(forms.ModelForm):
        class Meta:
            model = models.UserInfo
            fields = ["name", "password", "age",]
    
        def __init__(self, *args, **kwargs):
            super().__init__(*args, **kwargs)
            
            # 循环ModelForm中的所有字段,给每个字段的插件设置
            for name, field in self.fields.items():
                # 字段中有属性,保留原来的属性,没有属性,才增加。
                if field.widget.attrs:
    				field.widget.attrs["class"] = "form-control"
    				field.widget.attrs["placeholder"] = field.label
                else:
                    field.widget.attrs = {
                        "class": "form-control", 
                        "placeholder": field.label
                    }
    

    自定义类,然后继承

    class BootStrapModelForm(forms.ModelForm):
        def __init__(self, *args, **kwargs):
            super().__init__(*args, **kwargs)
            # 循环ModelForm中的所有字段,给每个字段的插件设置
            for name, field in self.fields.items():
                # 字段中有属性,保留原来的属性,没有属性,才增加。
                if field.widget.attrs:
    				field.widget.attrs["class"] = "form-control"
    				field.widget.attrs["placeholder"] = field.label
                else:
                    field.widget.attrs = {
                        "class": "form-control", 
                        "placeholder": field.label
                    }
    

    bootstrap样式继承实例

    class UserEditModelForm(BootStrapModelForm):
        class Meta:
            model = models.UserInfo
            fields = ["name", "password", "age",]
    
    class BootStrap:
        bootstrap_exclude_fields = []
    
        def __init__(self, *args, **kwargs):
            super().__init__(*args, **kwargs)
            # 循环ModelForm中的所有字段,给每个字段的插件设置
            for name, field in self.fields.items():
                if name in self.bootstrap_exclude_fields:
                    continue
                # 字段中有属性,保留原来的属性,没有属性,才增加。
                if field.widget.attrs:
                    field.widget.attrs["class"] = "form-control"
                    field.widget.attrs["placeholder"] = field.label
                else:
                    field.widget.attrs = {
                        "class": "form-control",
                        "placeholder": field.label
                    }
    
    
    class BootStrapModelForm(BootStrap, forms.ModelForm):
        pass
    
    
    class BootStrapForm(BootStrap, forms.Form):
        pass
    
    

    中间件

    小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第10张图片

    定义中间件类

    from django.utils.deprecation import MiddlewareMixin
    from django.shortcuts import HttpResponse
    
    class M1(MiddlewareMixin):
        """ 中间件1 """
    
        def process_request(self, request):
    
            # 如果方法中没有返回值(返回None),继续向后走
            # 如果有返回值 HttpResponse、render 、redirect
            print("M1.process_request")
            return HttpResponse("无权访问")
    
        def process_response(self, request, response):
            print("M1.process_response")
            return response
    
    
    class M2(MiddlewareMixin):
        """ 中间件2 """
    
        def process_request(self, request):
            print("M2.process_request")
    
        def process_response(self, request, response):
            print("M2.process_response")
            return response
    

    应用中间件 setings.py

    MIDDLEWARE = [
        'django.middleware.security.SecurityMiddleware',
        'django.contrib.sessions.middleware.SessionMiddleware',
        'django.middleware.common.CommonMiddleware',
        'django.middleware.csrf.CsrfViewMiddleware',
        'django.contrib.auth.middleware.AuthenticationMiddleware',
        'django.contrib.messages.middleware.MessageMiddleware',
        'django.middleware.clickjacking.XFrameOptionsMiddleware',
        'app01.middleware.auth.M1',
        'app01.middleware.auth.M2',
    ]
    

    中间件实现校验登录

    编写中间件

    from django.utils.deprecation import MiddlewareMixin
    from django.shortcuts import HttpResponse, redirect
    
    
    class AuthMiddleware(MiddlewareMixin):
    
        def process_request(self, request):
            # 0.排除那些不需要登录就能访问的页面
            #   request.path_info 获取当前用户请求的URL /login/
            if request.path_info == "/login/":
                return
    
            # 1.读取当前访问的用户的session信息,如果能读到,说明已登陆过,就可以继续向后走。
            info_dict = request.session.get("info")
            print(info_dict)
            if info_dict:
                return
    
            # 2.没有登录过,重新回到登录页面
            return redirect('/login/')
    

    应用中间件

    MIDDLEWARE = [
        'django.middleware.security.SecurityMiddleware',
        'django.contrib.sessions.middleware.SessionMiddleware',
        'django.middleware.common.CommonMiddleware',
        'django.middleware.csrf.CsrfViewMiddleware',
        'django.contrib.auth.middleware.AuthenticationMiddleware',
        'django.contrib.messages.middleware.MessageMiddleware',
        'django.middleware.clickjacking.XFrameOptionsMiddleware',
        'app01.middleware.auth.AuthMiddleware',
    ]
    

    登录与注销

    cookie和session

    # cookie,本质上保存在浏览器端的键值对。 
    # session,保存服务器端(django是将session默认存储在数据库中)
    
    def order_add(request):
        request.session['xx'] = 123
        
    def logout(request):
    	request.session.clear()
    
    

    登录

    def index(request):
        info = request.session.get("info")
        if not info:
            return redirect('/login/')
        
        ...
    

    注销

    def logout(request):
        """ 注销 """
    
        request.session.clear()
    
        return redirect('/login/')
    

    生成数字图片验证码

    pip install pillow
    
    import random
    from PIL import Image, ImageDraw, ImageFont, ImageFilter
    
    
    def check_code(width=120, height=30, char_length=5, font_file='Monaco.ttf', font_size=28):
        code = []
        img = Image.new(mode='RGB', size=(width, height), color=(255, 255, 255))
        draw = ImageDraw.Draw(img, mode='RGB')
    
        def rndChar():
            """
            生成随机字母
            :return:
            """
            return chr(random.randint(65, 90))
    
        def rndColor():
            """
            生成随机颜色
            :return:
            """
            return (random.randint(0, 255), random.randint(10, 255), random.randint(64, 255))
    
        # 写文字
        font = ImageFont.truetype(font_file, font_size)
        for i in range(char_length):
            char = rndChar()
            code.append(char)
            h = random.randint(0, 4)
            draw.text([i * width / char_length, h], char, font=font, fill=rndColor())
    
        # 写干扰点
        for i in range(40):
            draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())
    
        # 写干扰圆圈
        for i in range(40):
            draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())
            x = random.randint(0, width)
            y = random.randint(0, height)
            draw.arc((x, y, x + 4, y + 4), 0, 90, fill=rndColor())
    
        # 画干扰线
        for i in range(5):
            x1 = random.randint(0, width)
            y1 = random.randint(0, height)
            x2 = random.randint(0, width)
            y2 = random.randint(0, height)
    
            draw.line((x1, y1, x2, y2), fill=rndColor())
    
        img = img.filter(ImageFilter.EDGE_ENHANCE_MORE)
        return img, ''.join(code)
    
    
    if __name__ == '__main__':
        img, code_str = check_code()
        print(code_str)
    
        with open('code.png', 'wb') as f:
            img.save(f, format='png')
    

    ajax请求

    $.ajax({
        url:"发送的地址",
        type:"get",
        data:{
            n1:123,
            n2:456
        },
        success:function(res){
            console.log(res);
        }
    })
    

    GET请求

    $.ajax({
        url: '/task/ajax/',
        type: "get",
        data: {
            n1: 123,
            n2: 456
        },
        success: function (res) {
            console.log(res);
        }
    })
    
    from django.shortcuts import render, HttpResponse
    
    def task_ajax(request):
        print(request.GET)
        return HttpResponse("成功了")
    

    POST请求

    $.ajax({
        url: '/task/ajax/',
        type: "get",
        data: {
            n1: 123,
            n2: 456
        },
        success: function (res) {
            console.log(res);
        }
    })
    
    from django.shortcuts import render, HttpResponse
    from django.views.decorators.csrf import csrf_exempt
    
    
    @csrf_exempt
    def task_ajax(request):
        print(request.GET)
        print(request.POST)
        return HttpResponse("成功了")
    

    绑定事件

    {% extends 'layout.html' %}
    
    
    {% block content %}
        <div class="container">
            <h1>任务管理</h1>
    
            <h3>示例1</h3>
            <input id="btn1" type="button" class="btn btn-primary" value="点击"/>
    
        </div>
    {% endblock %}
    
    {% block js %}
        <script type="text/javascript">
            $(function () {
                // 页面框架加载完成之后代码自动执行
                bindBtn1Event();
    
            })
    
            function bindBtn1Event() {
                $("#btn1").click(function () {
                    $.ajax({
                        url: '/task/ajax/',
                        type: "post",
                        data: {
                            n1: 123,
                            n2: 456
                        },
                        success: function (res) {
                            console.log(res);
                        }
                    })
                })
            }
    
        </script>
    {% endblock %}
    

    ajax请求返回值接受

    {% extends 'layout.html' %}
    
    
    {% block content %}
        <div class="container">
            <h1>任务管理</h1>
    
            <h3>示例1</h3>
            <input id="btn1" type="button" class="btn btn-primary" value="点击"/>
    
        </div>
    {% endblock %}
    
    {% block js %}
        <script type="text/javascript">
            $(function () {
                // 页面框架加载完成之后代码自动执行
                bindBtn1Event();
    
            })
    
            function bindBtn1Event() {
                $("#btn1").click(function () {
                    $.ajax({
                        url: '/task/ajax/',
                        type: "post",
                        data: {
                            n1: 123,
                            n2: 456
                        },
                        dataType: "JSON",
                        success: function (res) {
                            console.log(res);
                            console.log(res.status);
                            console.log(res.data);
                        }
                    })
                })
            }
    
        </script>
    {% endblock %}
    
    import json
    from django.shortcuts import render, HttpResponse
    from django.http import JsonResponse
    from django.views.decorators.csrf import csrf_exempt
    
    
    def task_list(request):
        """ 任务列表 """
        return render(request, "task_list.html")
    
    
    @csrf_exempt
    def task_ajax(request):
        print(request.GET)
        print(request.POST)
    
        data_dict = {"status": True, 'data': [11, 22, 33, 44]}
        return HttpResponse(json.dumps(data_dict))
    

    jquery修改标签内容

    - 本质上:找到标签;操作标签。
    
    - 找标签
    	$("#x1")
    	$(".x1")
    	$("div")
    	
    	$("input[type='text']")   找到 input 标签且 type='text'
    - 操作标签
    	$("#x1").text()            <div id='x1'>dd</div>
    	$("#x1").text("xxx")       <div id='x1'>xxx</div>
    	
    	$("#x1").val()             <input id='x1' />
    	$("#x1").val("xxx")        <input id='x1' />
    	
    	$("#x1").attr("uu")           <div id='x1' uu="123">dd</div>
    	$("#x1").attr("uu","999")     <div id='x1' uu="999">dd</div>
    	
    	$("#x1").empty()          <div id='x1'>dd</div>  - 清空内容
    	$("#x1").remove()         <div id='x1'>dd</div>  - 整个标签删除
    

    文件上传

    基本操作

    <form method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <input type="text" name="username">
        <input type="file" name="avatar">
        <input type="submit" value="提交">
    form>
    
    from django.shortcuts import render, HttpResponse
    
    
    def upload_list(request):
        if request.method == "GET":
            return render(request, 'upload_list.html')
    
        # # 'username': ['big666']
        # print(request.POST)  # 请求体中数据
        # # {'avatar': []}>
        # print(request.FILES)  # 请求发过来的文件 {}
    
        file_object = request.FILES.get("avatar")
        # print(file_object.name)  # 文件名:[email protected]
    
        f = open(file_object.name, mode='wb')
        for chunk in file_object.chunks():
            f.write(chunk)
        f.close()
        return HttpResponse("...")
    

    批量上传文件至数据库案例

    {% extends 'layout.html' %}
    
    
    {% block content %}
    
        <div class="container">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title"> {{ title }} h3>
                div>
                <div class="panel-body">
                    <form method="post" enctype="multipart/form-data" novalidate >
                        {% csrf_token %}
    
                        {% for field in form %}
                            <div class="form-group">
                                <label>{{ field.label }}label>
                                {{ field }}
                                <span style="color: red;">{{ field.errors.0 }}span>
                            div>
                        {% endfor %}
    
                        <button type="submit" class="btn btn-primary">提 交button>
                    form>
                div>
            div>
        div>
    
    {% endblock %}
    
    
    from django import forms
    from app01.utils.bootstrap import BootStrapForm
    
    
    class UpForm(BootStrapForm):
        bootstrap_exclude_fields = ['img']
    
        name = forms.CharField(label="姓名")
        age = forms.IntegerField(label="年龄")
        img = forms.FileField(label="头像")
    
    
    def upload_form(request):
        title = "Form上传"
        if request.method == "GET":
            form = UpForm()
            return render(request, 'upload_form.html', {"form": form, "title": title})
    
        form = UpForm(data=request.POST, files=request.FILES)
        if form.is_valid():
            # {'name': '武沛齐', 'age': 123, 'img': }
            # 1.读取图片内容,写入到文件夹中并获取文件的路径。
            image_object = form.cleaned_data.get("img")
    
            # file_path = "app01/static/img/{}".format(image_object.name)
            db_file_path = os.path.join("static", "img", image_object.name)
    
            file_path = os.path.join("app01", db_file_path)
            f = open(file_path, mode='wb')
            for chunk in image_object.chunks():
                f.write(chunk)
            f.close()
    
            # 2.将图片文件路径写入到数据库
            models.Boss.objects.create(
                name=form.cleaned_data['name'],
                age=form.cleaned_data['age'],
                img=db_file_path,
            )
            return HttpResponse("...")
        return render(request, 'upload_form.html', {"form": form, "title": title})
    
    

    启用media

    urls.py操作

    from django.urls import path, re_path
    from django.views.static import serve
    from django.conf import settings
    
    urlpatterns = [
    	re_path(r'^media/(?P.*)$', serve, {'document_root': settings.MEDIA_ROOT}, name='media'),
    ]
    

    settings.py

    import os
    
    MEDIA_ROOT = os.path.join(BASE_DIR, "media")
    MEDIA_URL = "/media/"
    

    小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第11张图片

    混合数据保存数据库案例

    models.py

    class City(models.Model):
        """ 城市 """
        name = models.CharField(verbose_name="名称", max_length=32)
        count = models.IntegerField(verbose_name="人口")
    
        # 本质上数据库也是CharField,自动保存数据。
        img = models.FileField(verbose_name="Logo", max_length=128, upload_to='city/')
    

    ModelForm

    from app01.utils.bootstrap import BootStrapModelForm
    
    
    class UpModelForm(BootStrapModelForm):
        bootstrap_exclude_fields = ['img']
    
        class Meta:
            model = models.City
            fields = "__all__"
    

    视图函数

    def upload_modal_form(request):
        """ 上传文件和数据(modelForm)"""
        title = "ModelForm上传文件"
        if request.method == "GET":
            form = UpModelForm()
            return render(request, 'upload_form.html', {"form": form, 'title': title})
    
        form = UpModelForm(data=request.POST, files=request.FILES)
        if form.is_valid():
            # 对于文件:自动保存;
            # 字段 + 上传路径写入到数据库
            form.save()
            
            return HttpResponse("成功")
        return render(request, 'upload_form.html', {"form": form, 'title': title})
    

    小黑迈出了应用开发第一步,通过武沛奇老师b站django入门课程了解了django,准备学习前端基础:django入门沛奇老师课程笔记_第12张图片

    加油小黑黑,准备学前端基础,没事的时候多学习积蓄力量!

    你可能感兴趣的:(django学习笔记,django,学习,前端)