对应github地址：第9天
一. 实现我要学习功能
.png)
里面的三个字段对应operation/models/UserAsk中的变量
1. 首先对表单进行后台验证，新建orgazaiton/form文件，然后在里面定义之前的表单验证类。
因为我们已经定义了UserAsk类，发现定义的表单验证类和UserAsk类很相似，那么能不能把这个models里的类转变为表单验证类呢？那么我们需要用到ModelForm
.png)
2. 改写URL结构
首先改写org-list.html的访问URL，在mxonline/urls.py中将原先的URL改写为
.png)
新建organization/urls.py
.png)
然后访问http://127.0.0.1:8000/org/list，即可打开原先http://127.0.0.1:8000/org_list的访问内容
3. 使用modelform做表单提交
这里使用ajax异步操作，不对整个页面进行刷新，因此我们不能直接render一个页面回来，而是给前端返回json数据，而不是页面。那么就需要使用到HttpResponse类来指明给用户返回哪种类型数据
from django.http import HttpResponse
3.1 编写视图类organization/views.py->AddUserAskView
.png)
注意HttpResonse里面的单双引号的问题，一样要那样写，否则会出错，原因不明
3.2 organization/urls.py 中新增URL
.png)
3.3 url-list.html中关于我要学校的表单代码中的<form>标签中增加{% csrf_token %}
3.4 相关ajax请求在base.html中，看不太懂，注意里面的url, msg都和之前的设置相关联
.png)
监听这个button，如果用户点击了button，我们就向这个url进行post请求，然后把表单进行序列化
3.5 手机号码验证是否合法，在organization/forms.py中添加 clean_mobile函数（必须以clean开头）
.png)
二. 机构详情展示
1. 准备工作
在后台中新增几个教师和课程的数据，发现之前课程里没有到机构的外键，所有在courses/models.py-->class Course中新建一个外键
.png)
把org-detail-course.html, org-detail-desc.html, org-detail-homepage.html, org-detail-teachers.html 这四个页面放到templates目录下
2. 编写基础模板
我们发现这4个页面很相似，所以要再写一个基础页面org_base.html让他们来重载，把org-detail-homepage.html内容复制过来
2.1 把title名字用block包起来，在css, js后面新增block，用来处理在不同的页面可能定制不同的样式
.png)
.png)
.png)
2.2 分析页面可发现，页面左边是固定的，页面右边不同，对应的在代码中有<div class="left">，<div class="right">，因此我们需要用block包住<div class="right">
.png)
面包屑那里也要加block
.png)
2.3 替换js, css路径
重载static变量
.png)
使用模板标签修改路径如下
.png)
3. org-detail-homepage.html继承基础页面
删掉原先内容，把org_base.html的<div class="right">的3个div剪切过来
.png)
4. 为机构首页添加URL，view
organization/urls.py中增加
.png)
需要传一个课程机构的ID，来指定是哪个机构的首页
定义view，organization/views.py中新增
.png)
courses/models.py/class Course中有一个机构的外键，那么机构为主，所以可在机构的view中使用一个对象+课程类小写course+下划线+set的方法反向取到课程
5. 填充org-detail-homepage.html页面
原先有三个课程的<div>标签，把其中一个<div>放到for循环模板中，删掉其他
.png)
6. 在org-list.html页面修改机构<dl>标签中的机构的跳转链接<a href="org-detail-homepage.html">
修改为
.png)
其中course_org.id 为课程机构的ID号，数据库中自动生成的id号, 传递到跳转链接里，然后在organization/urls.py中的<int:org_id>就能取到这个id
all_orgs.object_list中的object_list为分页时的固定写法
7. 修改org_base.html中图片地址
在子页面中使用的变量标签，其实也是可以在基本页面中直接使用
.png)
上面这段代码影响的是机构详情页里面的头部信息，如下
.png)
8. 机构教师信息填充
1）. organization/models/class Teacher中新增一个讲师头像字段，并在后台添加头像
.png)
2）. org-detail-homepage.html中找到表示讲师的代码并修改昵称和图片
.png)
三. 机构课程列表页(org-detail-course.html)
1. 把org-detail-homepage.html中的内容拷贝过来，只须替换<div class="right">和标题就好
.png)
2. 编写url和view
organization/views.py中添加
.png)
organization/urls.py中添加
.png)
3. 修改org-base.html的left部分代码，使点击左侧的机构课程可成功跳转到org-detail-course.html页面
.png)
4. 在org-detail-course.html中把信息补充完整
.png)
5. 增加机构课程选中状态
在organization/views.py-->class OrgHomeView中增加一个变量current_page = "home",
orgCourseView中增加变量current_page = "course"
并且分别加到render函数中传递到org-detail-homepage.html页面
然后就可以在org_base.html页面中的<div class="left">中增加判断条件
.png)
四. 课程介绍页面
1. 同样的把<div class="right">替换一下
.png)
2. 配置URL，view
organization/views.py中增加
.png)
organization/urls.py中增加
.png)
3. 增加点击机构介绍跳转链接
在org_base.html中的<div class="left">中修改
.png)
五. 机构讲师
1. 修改页面
.png)
2. 配置view, URL
.png)
urls.py中
.png)
3. 增加跳转链接，在org_base.html页面中修改为如下
.png)
4. 显示讲师头像等信息，修改org-detail-teachers.html页面如下
.png)
5. 面包屑导航
在org_base.html中修改面包屑代码
.png)
然后在所有子页面中分别加入，改为相应的名字
{% block page_title %}机构课程{% endblock %}
六.课程机构收藏功能，也是ajax提交
1. 写view， URL
organization/views.py中增加
.png)
organization/urls.py中增加
.png)
2. 机构收藏功能的ajax代码放在org-base.html中
修改117行代码成如下图
.png)
修改135行为下图
.png)
修改window.location.href的地址
.png)
3. 如果机构已收藏，我们刷新后，又会显示收藏字样，不会显示已收藏，怎么办呢
3.1 organization/views.py-->class OrgHomeView中增加如下代码
.png)
并且在return render中加上
"has_fav": has_fav
3.2 org_base.html中大概51行的固定字段"收藏"修改为如下
.png)
分别在OrgCourseView, OrgDescView, OrgTeacherView添加上面相同代码
4. 机构页面显示登陆状态
把index.html中的<head>标签中if模板标签拷贝到org_base.html中替换一下
- 17、Django实战第17天：机构详情展示
1.进入xadmin添加测试数据(教师.课程) 2.把以下4个前端页面复制到templates中 先打开这几个页面分析,它们和之前的课程机构列表页是不一样的机构,且没有共同的部分,但是这4个页面却是类 ...
- 25、Django实战第25天：讲师详情页
1.复制teacher-detail.html到templates目录下 2.编辑teacher-detail.html,继承base.html 3.编辑organization.view.py cl ...
- mxonline实战13，授课讲师列表页，详情页，index页面全局导航
对应github地址:第13天 把teacher-list.html和teacher-detail.html拷贝过来 一. 授课讲师列表页 1. 修改html文件 把org-list.ht ...
- mxonline实战11，课程详情页2，课程章节页
对应github地址:第11天 一. 课程详情页2 1. 课程详情页第2块中的课程介绍中,修改course-detail.html中代码,搜索课程详情,找到如下代码
- 20、Django实战第20天：课程详情页
1.把course-detail.html复制到templates目录下 2.编辑course-detail.html,分析页面,继承base.html 3.编辑courses.views .... ...
- 18、Django实战第18天：课程机构收藏功能
这里点击"收藏"也是ajax异步操作,我在operation.model.py中创建了一个用户收藏表,其中fav_id字段,如果我们收藏的是课程,那就是课程id,如果收藏的是课程机 ...
- ajax“显示弹窗详情”和“删除”功能练习
1.查看详细信息,以弹窗的形式显示,使用ajax 2.批量删除 “查询”功能可以参考前面的文章,这里只讲解ajax“显示弹窗详情”和“删除”功能 第一:在body中的代码 <title>a ...
- mxonline实战10，课程列表页，课程详情页1
对应github地址:第10天 一. 课程列表页 1. 拷贝course-list.html到templates目录中 2. 编写url和view 在courses/views.py中新加
- mxonline实战8，机构列表分页功能，以及按条件筛选功能
对应github地址:列表分页和按条件筛选 一. 列表分页 1. pip install django-pure-pagination 2. settings.py中 install ...
随机推荐
- clr相关名词
程序集:一个或多个类型定义文件和资源文件的集合 Native Code(本机代码): 已被编译为特定于处理器的机器码的代码. 本地代码(native code)是计算机编程(代码),编译用来运行一个特 ...
- Redis 授权操作
[Redis 授权操作] AUTH password 通过设置配置文件中 requirepass 项的值(使用命令 CONFIG SET requirepass password ),可以使用密码来保 ...
- Fundamentals of Garbage Collection
[Fundamentals of Garbage Collection] 1.Reclaims objects that are no longer being used, clears their ...
- (K)ubuntu上将分区格式化成NTFS格式
新买了硬盘,装系统时,为Windows预留了几个分区,由于没有其他选择,因此将分区格式化成了fat32格式.装完系统后,总是很纠结,想把这些分区格式化成NTFS格式. google了一下,从这个网址( ...
- Qt Pro file
Qt keys qmake Manual Building Common Project Types #~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- Oracle ADF 创建序列
双击VO,打开Attribute 标签页在弹出的窗口中选择Default Value Type 为“Expression”, value 的值为:(new oracle.jbo.server.Sequ ...
- 二分图 and code1170 双栈排序
6.6二分图 二分图是这样一个图: 有两顶点集且图中每条边的的两个顶点分别位于两个顶点集中,每个顶点集中没有边直接相连接. 无向图G为二分图的充分必要条件是,G至少有两个顶点,且其所有回路的长度均为偶 ...
- GlobalMemoryStatusEx获取内存
typedef struct _MEMORYSTATUSEX { DWORD dwLength; DWORD dwMemoryLoad; DWORDLONG ullTotalPhys; DWORDLO ...
- 自旋构造（更新）c#
int x; void MultiplyXBy (int factor) { var spinWait = new SpinWait(); while (true) { int snapshot1 = ...
- Python中ndarray数组切片问题a[-n -x:-y]
先看看如下代码: >>a=np.arange(10)>>a array([0, 1, 2, 3, 4, 5, 6, 7, 8, 9])>>a[-7:] array( ...
