[py][mx]django课程页显示city和机构封面图

city和课程机构信息展示到前台去

organization/views.py

from django.views.generic.base import View
from organization.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
        })
path('org_list/', org_views.OrgView.as_view(), name="org_list"),

前端修改

<img src="{{ MEDIA_URL }}{{ course_org.image }}

前端要想获取到{{ MEDIA_URL }}变量,后端settings必须配置

        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
                'django.template.context_processors.media', #将MEDIA_URL变量注入到模板 参考: https://docs.djangoproject.com/en/2.0/ref/templates/api/
            ],
        },
{% block content %}
    {#    机构类别    #}
    <div>
        <p>机构类别: 全部 培训结构 高校 个人</p>
    </div>

    {#    城市    #}
    <div>
        <p>城市:{% for city in all_citys %}
            {{ city.name }}
        {% endfor %}
        </p>
    </div>
    {#    课程机构    #}
    <div>
        <ul>
            {% for course_org in all_orgs %}
                <li><img src="{{ MEDIA_URL }}{{ course_org.image }}" alt=""></li>
            {% endfor %}
        </ul>
    </div>
{% endblock %}

静态图片展示

urls.py

from django.views.static import serve


# 课程机构
path('org_list/', org_views.OrgView.as_view(), name="org_list"),
## 配置上传文件的访问处理函数  这里使用django内置的serve来返回MEDIA_ROOT
url(r'^media/(?P<path>.*)', serve, {'document_root':MEDIA_ROOT}),

机构封面图的url已经解析正常
1312420-20180203234331281-1855030224.png

可见至少课程机构封面图和城市已经展示出来了.
1312420-20180203234344515-607613289.png

完整的org-list.html

{% extends 'base.html' %}{# 一定要出现在第一行 #}
{% load staticfiles %}
{% block title %}
    课程列表
{% endblock %}

{% block custom_bread %}
    <div>
        <ul>
            <li><a href="">首页</a>>课程机构</li>

        </ul>
    </div>
{% endblock %}

{% block content %}
    {#    机构类别    #}
    <div>
        <p>机构类别: 全部 培训结构 高校 个人</p>
    </div>

    {#    城市    #}
    <div>
        <p>城市:{% for city in all_citys %}
            {{ city.name }}
        {% endfor %}
        </p>
    </div>
    {#    课程机构    #}
    <div>
        <ul>
            {% for course_org in all_orgs %}
                <li><img src="{{ MEDIA_URL }}{{ course_org.image }}" alt=""></li>
            {% endfor %}
        </ul>
    </div>
{% endblock %}

转载于:https://www.cnblogs.com/iiiiiher/p/8411238.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值