• 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 {
                 100%;
                height: 40px;
                background-color: #2aabd2;
            }
    
            .content {
                 100%;
                height: 520px;
    
            }
    
            .left, .right {
                float: left;
    
            }
            .left{
                20%;
                height: 520px;
                background-color: greenyellow;
            }
            .footer {
                 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': '3306', #你的数据库端口
    
        }
    
    }

    设置前端的静态文本:

    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)

    V:

    """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),
    ]

     T

    <!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("").在前端用句点符.获取。

  • 相关阅读:
    13.线性回归
    12.scikit-learn中的Scaler
    11.数据归一化
    oracle之二表的几种类型
    oracle之二表和表空间的关系
    oracle之二数据字典表和动态性能视图
    oracle之二检查点
    oracle之二管理undo
    oracle之二归档日志
    oracle之二日志挖掘log miner
  • 原文地址:https://www.cnblogs.com/1a2a/p/7732520.html
Copyright © 2020-2023  润新知