BookStrap之模板继承

模板继承 (extend)

Django模版引擎中最强大也是最复杂的部分就是模版继承了。模版继承可以让您创建一个基本的“骨架”模版，它包含您站点中的全部元素，并且可以定义能够被子模版覆盖的 blocks 。

通过从下面这个例子开始，可以容易的理解模版继承：

<!DOCTYPE html>

<html lang="en">

<head>

    <link rel="stylesheet" href="style.css" />

    <title>{% block title %}My amazing site{%/span> endblock %}</title>

</head>

<body>

    <div id="sidebar">

        {% block sidebar %}

        <ul>

            <li><a href="/">Home</a></li>

            <li><a href="/blog/">Blog</a></li>

        </ul>

        {% endblock %}

    </div>

    <div id="content">

        {% block content %}{% endblock %}

    </div>

</body>

</html>

这个模版，我们把它叫作 base.html，它定义了一个可以用于两列排版页面的简单HTML骨架。“子模版”的工作是用它们的内容填充空的blocks。

在这个例子中， block 标签定义了三个可以被子模版内容填充的block。 block 告诉模版引擎：子模版可能会覆盖掉模版中的这些位置。

子模版可能看起来是这样的：

{% extends "base.html" %}//先写上从哪里继承的模板

 

{% block title %}My amazing blog{% endblock %}//用这个数据去替换掉模板里的内容

 

{% block content %}

{% for entry in blog_entries %}//用的是循环来显示内容

    <h2>{{ entry.title }}</h2>

    <p>{{ entry.body }}</p>

{% endfor %}这个是标签的结束标志

{% endblock %}

快捷键：先写block接着按Table快捷键

extends 标签是这里的关键。它告诉模版引擎，这个模版“继承”了另一个模版。当模版系统处理这个模版时，首先，它将定位父模版——在此例中，就是“base.html”。

那时，模版引擎将注意到 base.html 中的三个 block 标签，并用子模版中的内容来替换这些block。根据 blog_entries 的值，输出可能看起来是这样的：

<!DOCTYPE html>

<html lang="en">

<head>

    <link rel="stylesheet" href="style.css" />

    <title>My amazing blog</title>

</head>

 

<body>

    <div id="sidebar">

        <ul>

            <li><a href="/">Home</a></li>

            <li><a href="/blog/">Blog</a></li>

        </ul>

    </div>

 

    <div id="content">

        <h2>Entry one</h2>

        <p>This is my first entry.</p>

 

        <h2>Entry two</h2>

        <p>This is my second entry.</p>

    </div>

</body>

</html>

请注意，子模版并没有定义 sidebar block，所以系统使用了父模版中的值。父模版的 {% block %} 标签中的内容总是被用作备选内容（fallback）。父标签里的block名字不能重复，不然找不到是哪个对应哪个。

如果要继承父标签的名字里面的内容可以用：

{% block menu %}

     <p><h>班级信息</h></p>

     {{ block.super }}//继承父亲的用这种方法

{% endblock %}

今日代码：

urls

from django.conf.urls import url

from django.contrib import admin

from app01 import  views

urlpatterns = [

    url(r'^admin/', admin.site.urls),

    url(r'^class/',views.class_info),

    url(r'^studentInfo/(\d+)',views.student_info),

]

views

from django.shortcuts import render

# Create your views here.

def class_info(request):

    return  render(request,"index3.html")

def student_info(request,id):

   return  render(request,"studentInfo.html",{"class_id":id})

Templates

母模版

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

    <style>

        .header {

            width: 100%;

            height: 40px;

            background-color: #2aabd2;

        }

        .content {

            width: 100%;

            height: 520px;

        }

        .left, .right {

            float: left;

        }

        .left{

            width:20%;

            height: 520px;

            background-color: greenyellow;

        }

        .footer {

            width: 100%;

            height: 40px;

            background-color: palevioletred;

        }

    </style>

</head>

<body>

<div class="header"></div>

<div class="content">

    <div class="left">

        {% block  menu %}

            <ul>

                <li><a href="/studentInfo/6">S6</a></li>

                <li><a href="/studentInfo/7">S7</a></li>

                <li><a href="/studentInfo/8">S8</a></li>

            </ul>

        {% endblock %}

    </div>

    <div class="right">

        {% block con %}

        {% endblock %}

    </div>

</div>

<div class="footer"></div>

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

</head>

<body>

{% extends "base.html" %}//继承母模版

{% block con %}这里包括开始和模板的名字

    <h2>首页</h2>

{% endblock %}

</body>

</html>

{%  extends "base.html" %}

{% block menu %}

     <p><h>班级信息</h></p>

     {{ block.super }}//继承父亲的用这种方法

{% endblock %}

{% block con %}

    <p><h>学生信息</h></p>

    <h2>第{{ class_id }}页</h2>

    <h>{{ class_id }}:班</h>

{% endblock %}

ORM:

这次数据库用的是MySQL需要更改数据配置：和注销掉原来django自带的数据库

DATABASES = {

    'default': {

        'ENGINE': 'django.db.backends.mysql',

        'NAME': 'crm',    #你的数据库名称

        'USER': 'root',   #你的数据库用户名

        'PASSWORD': '', #你的数据库密码

        'HOST': '', #你的数据库主机，留空默认为localhost

        'PORT': '', #你的数据库端口

    }

}

设置前端的静态文本：

static也需要在setting里面需要修改：

STATIC_URL = '/static/'

STATICFILES_DIR=[

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

]

图书管理系统：先配置文件接着运行数据库持久化用两行代码做数据库的持久化

M：

from django.db import models

# Create your models here.

class Book(models.Model):

    nid=models.AutoField(primary_key=True)

    title=models.CharField(max_length=32)

    author=models.CharField(max_length=32)

    publishDate=models.DateField()

    price=models.DecimalField(max_digits=5,decimal_places=2)

"""mysite1 URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:

    https://docs.djangoproject.com/en/1.11/topics/http/urls/

Examples:

Function views

    1. Add an import:  from my_app import views

    2. Add a URL to urlpatterns:  url(r'^$', views.home, name='home')

Class-based views

    1. Add an import:  from other_app.views import Home

    2. Add a URL to urlpatterns:  url(r'^$', Home.as_view(), name='home')

Including another URLconf

    1. Import the include() function: from django.conf.urls import url, include

    2. Add a URL to urlpatterns:  url(r'^blog/', include('blog.urls'))

"""

from django.conf.urls import url

from django.contrib import admin

from app003 import  views

urlpatterns = [

    url(r'^admin/', admin.site.urls),

    url(r'^index/', views.index),

    url(r'^del/(\d+)', views.del_book),

    url(r'^edit/(\d+)', views.edit_book),

    url(r'^edit/', views.edit_book),

    url(r'^add/', views.add_book),

]

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">

    <script src="/static/bootstrap-3.3.7/js/bootstrap.min.js"></script>

    <style>

        .container {

            margin-top: 100px;

        }

        .btn-primary{

            margin-bottom: 50px;

        }

    </style>

</head>

<body>

<div class="container">

    <div class="row">

        <div class="col-md-6 clo-md-offset-2">

            <table class=" table table-striped text-center table-bordered">

                <thead>

                <tr>

                    <th class="text-center">编号</th>

                    <th class="text-center">姓名</th>

                    <th class="text-center">作者</th>

                    <th class="text-center">出版日期</th>

                    <th class="text-center">价格</th>

                    <th class="text-center">操作</th>

                    <a href="/add/"><button class="btn btn-primary">添加</button></a>

                </tr>

                </thead>

                <tbody>

                {% for book in bookList %}

                    <tr>

                        <td>{{ book.nid }}</td>

                        <td>{{ book.title }}</td>

                        <td>{{ book.author }}</td>

                        <td>{{ book.publishDate|date:"Y-m-d" }}</td>

                        <td>{{ book.price }}</td>

                        <td>

                            <a href="/del/{{ book.nid }}"><button class="btn btn-danger"> 删除</button></a>

                            <a href="/edit/{{ book.nid }}"><button class="btn btn-info"> 编辑</button></a></td>

                    </tr>

                {% endfor %}

                </tbody>

            </table>

        </div>

    </div>

</div>

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

</head>

<body>

<form action="/index/" method="post">

{#    {% csrf_token %}#}

   <p>编号：<input type="text" name="id"  value={{  }}></p>

   <p>书名：<input type="text" name="title"  value={{  }}></p>

   <p>作者：<input type="text" name="author" value={{  }}></p>

   <p>出版日期：<input type="text" name="publishDate" value={{  }}></p>

   <p>价格：<input type="text" name="price" value={{  }}></p>

   <p><input type="submit" ></p>

</form>

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

</head>

<body>

<form action="/index/" method="post">

   <p>书名：<input type="text" name="title" ></p>

   <p>作者：<input type="text" name="author"></p>

   <p>出版日期：<input type="text" name="publishDate"></p>

   <p>价格：<input type="text" name="price"></p>

   <p><input type="submit" ></p>

</form>

</body>

</html>

在后台获取数据首先想到用form表单的方法获取：request.POST.get(" ")或者request.GET.get("").在前端用句点符.获取。

BookStrap之模板继承的更多相关文章

Python自动化之模板继承和cookie
request请求头信息 type(request) //查看类 from django.core.handlers.wsgi import WSGIRequest 结果会以字典的形式存在 reque ...
Django（4）html模板继承、模板导入、分页实现
1.获取所有请求信息导入模块:from django.core.handlers.wsgi import WSGIRequest request.environ:包含所有的请求信息,可以打印看一下, ...
tp框架之模板继承
模板继承是一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个基础模板(或者是布局),并且其中定义相关的区 ...
Django 中url补充以及模板继承
Django中的URL补充默认值在url写路由关系的时候可以传递默认参数,如下: url(r'^index/', views.index,{"name":"root& ...
Thinkphp3.2中的模板继承
1:模板继承: 是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个基础模板( ...
Django1.9开发博客（6）- 模板继承
模板继承就是网站的多个页面可以共享同一个页面布局或者是页面的某几个部分的内容.通过这种方式你就需要在每个页面复制粘贴同样的代码了. 如果你想改变页面某个公共部分,你不需要每个页面的去修改,只需要修改一 ...
thinkphp中模板继承
模板继承是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个基础模板(或者是布局), ...
python【第二十一篇】Django模板继承、分页、cookie验证
1.模板继承母版master.html {% block title %}{% endblock %}2 {% block table-cont %}{% endblock %} 子板 {% ext ...
php随机10-thinkphp 3.1.3 模板继承布局
8.25 模板继承模板继承是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个 ...

随机推荐

Aho-Corasick automaton（AC自动机）解析及其在算法竞赛中的典型应用举例
摘要: 本文主要讲述了AC自动机的基本思想和实现原理,如何构造AC自动机,着重讲解AC自动机在算法竞赛中的一些典型应用. 什么是AC自动机? 如何构造一个AC自动机? AC自动机在算法竞赛中的典型应用 ...
.net实现支付宝在线支付
流程参考<实物商品交易服务集成技术文档2.0.pdf>网关地址http://paytest.rupeng.cn/AliPay/PayGate.ashx 网关参数说明:partner:商户编 ...
C#新功能--命名参数
命名参数会潜在的改变编写代码的方式.这个新功能能使代码更容易阅读和理解. 例如,看一下System.IO名称空间中的File.Copy()方法,它一般构建为 File.Copy(@"C:\m ...
Mysql常用函数总结(二)
有的时候们需要了解当前的时间,这时候我们就可以调用时间函数了.下面就是一些常用的时间函数下面来说一下DATE_FORMAT(date,format):format可以有以下格式符:举个例子吧! mys ...
Flask在Pycharm开启调试模式
一.Flask在Pycharm2018前的版本只需设置(两种方法之一): 1. 直接设置app的debug为true: app.debug=true 2. 把debug=true作为参数,传入到 ...
【Spring】20、使用TransactionSynchronizationManager在spring事务提交之后进行一些操作。
本文内容如何在spring事务提交之后进行一些操作,这些操作必须得在该事务成功提交后才执行,回滚则不执行. 要点如何在spring事务提交之后操作如何在spring事务回滚之后操作实现方案使 ...
java_查找里程
题目内容: 下图为国内主要城市之间的公路里程: 你的程序要读入这样的一张表,然后,根据输入的两个城市的名称,给出这两个城市之间的里程. 注意:任何两个城市之间的里程都已经给出,不需要计算经第三地中转. ...
LintCode Binary Search
For a given sorted array (ascending order) and a target number, find the first index of this number ...
洛谷P2447 [SDOI2010]外星千足虫(异或方程组)
题意题目链接 Sol 异或高斯消元的板子题. bitset优化一下,复杂度\(O(\frac{nm}{32})\) 找最优解可以考虑高斯消元的过程,因为异或的特殊性质,每次向下找的时候找到第一个1然 ...
Vue和React的对比
今晚我们来搞一搞Vue和React的对比好吧,话不多说今天我们直接开搞可好,各位小老板,开始吧 1. react整体是函数式的思想,把组件设计成纯组件,状态和逻辑通过参数传入, 所以在react中,是 ...

BookStrap之模板继承

BookStrap之模板继承的更多相关文章

随机推荐

热门专题