7-1 django templates模板继承1

  • 机构可以筛选类别
  • 机构可以根据所在地区进行分类

右侧我要学习功能: form表单提交
右下:授课机构排名

页面头部与底部为全局头和全局底部。

Django template 共用头部底部机制

将head和foot放在两个html中,然后在写其他需要这两个部分的页面时include进来。

Django也是支持include机制的。

include的问题

include的进来的死页面,这时候该怎么办?

解决这种问题:进行模板的继承机制。定义一个父类的框架,子类可以替换其中一部分block,子类只需要重写自己需要改变的block。

template中新建base.html

将课程机构列表页。orglist拷贝进template目录

将orglist内容替换base内容。

 
mark

将div收起来

 
mark

loadstaticfiles & 修改静态文件路径为static

这个步骤做过太多遍了,自行完成。耐心就行了。

定义父模板: 包含head & footer

title应该是可以被子页面替换的所以要包起来。

 
mark

css有共用的部分,也有可以被子页面替换的部分。

 
mark

js同理

 
mark

面包屑是需要被各个页面自己替换的。

 
mark

将正文内容包起来;

 
mark

此时base页面就制作好了

7-2 开始orglist编写

第一步:清空所有内容

  • 继承base页面
 
mark
  • 覆盖父类的title
 
mark
  • 书写课程机构view
    organization/views.py
# encoding: utf-8
from django.views.generic.base import View
# 处理课程机构列表的view
class OrgView(View):
def get(self,request):
return render(request, "org-list.html", { })
  • Django2.0.1配置课程机构首页url
    # 课程机构首页url
path('org_list/', OrgView.as_view(), name="org_list"),
  • Django1.9.8配置url:
    # 课程机构首页url
url(r'^org_list/$', OrgView.as_view(), name="org_list"),

修改面包屑

  • base中只保留首页

  • org中重写block custom_bread

  • block之间没有先后顺序。

  • 将base中block content拿到orglist重写

 
mark
  • 然后将base中block中间section删除掉
 
mark

orglist开始loadstaticfiles

ctrl+d快速删除

 
mark

页面的继承关系使得变量也可以直接用

比如user中的form数据传递到register文件当中.如果register继承的是base页面。
base页面当中也是可以用这些数据的。参数的向上传递

每个request对象都会传递到html中来,如果继承了base,request也会向上传递到base。
base中就可以加入我们的逻辑: 用户是否登录等。

小节结束对应commit:

完成Django templates的继承关系了解,机构列表展示页。对应7-1 & 2

7-3 课程机构列表页数据展示1

确定由后台传过来的动态数据:

授课机构列表本身, 授课机构的排名,所在地区(后台取出所有地区), 机构类别写成静态,因为一般不怎么变动。

在xadmin中添加城市信息,课程信息。

添加城市

 
mark

添加机构。

插播知识点:

 
mark

这里指定的路径是一个相对路径

setting中要配置我们把文件存放在哪个根目录之下

# 设置我们上传文件的路径

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

在项目根目录创建media文件夹

在后台上传图片

 
mark
 
mark

修改机构信息中封面图为logo

自行添加十个课程机构

models中添加机构类别

organization/models.py:

class CourseOrg(models.Model):
ORG_CHOICES =(
("pxjg", u"培训机构"),
("gx", u"高校"),
("gr", u"个人"),
) name = models.CharField(max_length=50, verbose_name=u"机构名称")
# 机构描述,后面会替换为富文本展示
desc = models.TextField(verbose_name=u"机构描述")
# 机构类别:
category = models.CharField(max_length=20, choices=ORG_CHOICES, verbose_name=u"机构类别", default="pxjg")

修改了models之后做数据库的变动:

makemigrations organization
migrate organization
 
mark

完成之后打开Navicat进行验证:

 
mark

可以看到新增了。

完善我们的view

将列表里的静态数据变成后台获取的动态数据

organization/views.py

from .models import CourseOrg, CityDict

class OrgView(View):
def get(self,request):
# 查找到所有的课程机构
all_orgs = CourseOrg.objects.all()
# 取出所有的城市
all_citys = CityDict.objects.all() return render(request, "org-list.html", {
"all_orgs":all_orgs,
"all_citys": all_citys,
})

作者:原文学习来自简书,作者:天涯明月笙
链接:https://www.jianshu.com/p/90aa4d5fae6a

django+xadmin在线教育平台(十四)的更多相关文章

  1. django+xadmin在线教育平台(四)

    3-2 配置表单页面 必要的该说的,该了解的 前置条件: 你已经学习了前面教程.将项目的文件夹目录结构,setting配置等修改完毕与我保持一致. 本节通过Django快速的配置一个留言板页面来学习 ...

  2. django+xadmin在线教育平台(一)

    大家好,此教程为在慕学网的实战教程Python升级3.6 强力Django+杀手级Xadmin打造在线教育平台的学习笔记,不对望指正! 使用Django+Xadmin打造在线教育平台(Python2, ...

  3. django+xadmin在线教育平台(五)

    3-3 django orm介绍与model设计 上节教程完成后代码(来学习本节前置条件): 对应commit: 留言板前端页面展示.本次内容截止教程3-2结束. 可能现在你还在通过手写sql语句来操 ...

  4. django+xadmin在线教育平台(十)

    剩余app model注册 courses注册 新建courses/adminx.py: # encoding: utf-8 __author__ = 'mtianyan' __date__ = '2 ...

  5. django+xadmin在线教育平台(十六)

    7-7 modelform 提交我要学习咨询1 对应表userask form会对字段先做验证,然后保存到数据库中. 可以看到我们的forms和我们的model中有很多内容是一样的.我们如何让代码重复 ...

  6. django+xadmin在线教育平台(十五)

    7-4 课程机构列表页数据展示2 前去html中进行数据填充   mark 可以看到所有城市是通过a标签,当前选中城市为active.   mark 之后把下面的写死的城市删除掉.   mark 这时 ...

  7. django+xadmin在线教育平台(十二)

    6-4 用form实现登录-1 上面我们的用户登录的方法是基于函数来做的.本节我们做一个基于类方法的版本. 要求对类的继承有了解. 基础教程中基本上都是基于函数来做的,其实更推荐基于类来做.基于类可以 ...

  8. django+xadmin在线教育平台(六)

    4-1 使用py3.6和django1.11开发系统前注意事项 直接通过Python3.6和django最新版本来开发我们的系统的一些注意事项. 原版本: Python 2.7 & djang ...

  9. django+xadmin在线教育平台(十七)

    8-1 课程列表 拷贝课程列表页到template目录 创建课程相关的urls.py Mxonline2/urls.py中声明包含到course的url中: # 课程app的url配置 url(r&q ...

随机推荐

  1. pat1088. Rational Arithmetic (20)

    1088. Rational Arithmetic (20) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue F ...

  2. 添加、修改、删除XML节点代码例子

    version="1.0" encoding="gb2312"?> . <bookstore> . <book genre=" ...

  3. 数据库存储的数据(如果是<p>数据</p>或者<img src="" />等格式)(asp.net)

    1.用方法@Html.Raw() @Html.Raw(数据库提取的数据放在这里)

  4. 第三方缓存软件memcached和redis异同

    memcached和redis相同点:都是以键值对的形式来存储数据,通俗讲就是一个大的hashtable缓存数据都是存在内容中 key-value 不同点:memcached:1.一个key所对应的值 ...

  5. Spring-cloud学习线路

    学习本学习路线学习完,大家将会对微服务.Spring Cloud.Docker.Kubernetes有一个系统.全面的认识.通过学习,将能掌握相关的知识体系,并能够投入到项目实战中去. 本学习路线采用 ...

  6. 设置Tomcat的字符编码

    在 server.xml 中的 Connector 标签在加入 URIEncoding="UTF-8" 属性. <Connector port="8080" ...

  7. SublimeText插件autoprefixer : css 添加前续

    /* 使用前 */ body { background: linear-gradient(to bottom, #DADADA, #000); } p a { -webkit-border-radiu ...

  8. jQuery(四)(DOM一)

    jQuery把复杂的代码简单化. 如果我们通过AJAX获取到数据之后然后才能确定结构的话,这种情况就需要动态的处理节点了 一.DOM节点的创建:创建div节点元素的属性和创建div节点元素的样式doc ...

  9. 建立本地yum源

    使用环境 服务器处于内网,需要更新 网络资源紧张,节约带宽 建立yum目录 mkdir -p /opt/opmgmt/yum rsync服务器列表 centos mirrors epel mirror ...

  10. Js 数据类型 Number()转型函数

    alert(Number(true)); //转换为1,如果为false为0 alert(Number()); //25,数值型直接返回 alert(Number(null)); //0,空对象返回0 ...