Django模板使用

最新推荐文章于 2024-09-29 10:54:58 发布
最新推荐文章于 2024-09-29 10:54:58 发布
阅读量152 收藏
点赞数
分类专栏： web python 文章标签： django 前端 bootstrap
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhaodongdz/article/details/128828707
版权
python 同时被 2 个专栏收录
20 篇文章 0 订阅
订阅专栏
web
3 篇文章 0 订阅
订阅专栏

Django框架里可以自己制定模板用于编写网页，这里记录一下

1.模板的制定

{% load static %}
<!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.0">
    <title>Document</title>
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    
</head>
<body>
<nav class="navbar navbar-default">
  <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">联通用户管理系统</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        {% comment %} <li class="active"><a href="#">部门管理 <span class="sr-only">(current)</span></a></li> {% endcomment %}
        <li><a href="/depart/list/">部门管理</a></li>
        <li><a href="/user/list/">用户管理</a></li>
      </ul>
      {% comment %} <form class="navbar-form navbar-left">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Search">
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form> {% endcomment %}
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">登录</a></li>
        <li><a href="#">注册</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">我的 <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">个人资料</a></li>
            <li><a href="#">我的设置</a></li>
            <li><a href="#">我的信息</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">注销</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>

{% comment %} 模板内需要修改内容部门 {% endcomment %}

{% block content%}

{% endblock %}


<script src="{% static 'js\jquery-3.6.3.min.js' %}"></script>
<script src="{% static 'plugins\bootstrap-3.4.1-dist\js\bootstrap.min.js' %}"></script>
</body>
</html>

上述的模板是在上层制定了一个导航条，在{% block 字段名称 %}  {% endblock %}中间编写需要增加的内容。

使用如下：

{% extends "layout.html" %}

{% block content %}
 <div>
            <div class="container"> 
                <div class="bs-example" >
                    <div class="panel panel-default">
                    <!-- Default panel contents -->
                    <div class="panel-heading">
                    <h3 class="panel-title">新增用户</h3></div>

                    <div class="panel-body">
                        <form method="POST">
                        {% csrf_token %}
                            <div class="form-group">
                                <label>姓名</label>
                                <input type="text" class="form-control" placeholder="姓名" name="user"/>
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" class="form-control" placeholder="密码" name="pwd" />
                            </div>
                            <div class="form-group">
                                <label>年龄</label>
                                <input type="text" class="form-control" placeholder="年龄"  name="age" />
                            </div>
                            <div class="form-group">
                                <label>余额</label>
                                <input type="text" class="form-control" placeholder="余额" name="ac" />
                            </div>
                            <div class="form-group">
                                <label>入职时间</label>
                                <input type="text" class="form-control" placeholder="入职时间"  name="ctime" />
                            </div>
                            <div class="form-group">
                                <label>性别</label>
                                <select class="form-control" name="gd">
                                    {% for item in gender_choices %}
                                        <option value="{{item.0}}">{{item.1}}</option>
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="form-group">
                                <label>所属部门</label>
                                <select class="form-control" name="dp">
                                    {% for depart in depart_list %}
                                        <option value="{{depart.id}}">{{depart.title}}</option>
                                    {% endfor %}
                                </select>
                            </div>



                            
                            {% comment %} <div class="form-group">
                                <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
                                <div class="col-sm-10">
                                <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
                                </div>
                            </div> {% endcomment %}
                            
                            <div class="form-group">
                                <div >
                                <button type="submit" class="btn btn-primary">提 交</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    </div>
                </div>
            </div>
        </div>
{% endblock content %}

秋冬晚归客
关注
专栏目录
Django_layui后台模板
10-09
4. 使用Django_layui模板的优势： - 界面美观：Layui提供的UI组件和主题使后台看起来更加专业和现代化。 - 开发效率：Django的MVT模式和Layui的组件化设计，使得开发者能快速实现功能并减少重复工作。 - 易于定制...
Django模板Templates使用方法详解
12-31
一、django的模板： 在settings.py的文件中可以看到并设置这个模板。 1.直接映射： 通过建立的文件夹（templates）和文件（html）来映射。 <!DOCTYPE html> <html lang=en> <head> <meta ...
Django模板的使用方法
大河之犬的博客
03-18 1947
一个布尔值，为True时，模板引擎会在已安装应用的templates子目录中查找模板。一个目录列表，指定模板文件的存放路径。模板引擎将按照列表中定义的顺序查找模板文件。csrf_token 用于form表单中，作用是跨站请求伪造保护。标签，在用 form 表单时，要再次跳转页面会报403权限错误。标签，在 form 表单提交数据时，才会成功。标签允许在模板中包含其它的模板的内容。模板过滤器可以在变量被显示前修改它。模板标签，用于后端向前端传递数据。从句：在循环为空的时候执行。索引下标取出对应的元素。
Django模板语言 以及使用
热门推荐
weixin_45185267的博客
06-11 1万+
这是一篇django中模板语言以及使用
django模板语言使用
笑笑生的博客
06-28 3430
模板功能作用：生成html界面内容，模版致力于界面如何显示，而不是程序逻辑。模板不仅仅是一个html文件，还包括了页面中的模板语言。静态内容：css,js,html。动态内容：通过模板语言，动态生成一些网页内容模板使用： 在视图函数中，使用模板产生html内容返回给客户端方式一：加载模板文件（loader.get_template）模板渲染，产生标准的html页面内容（render）通过HttpR...
Django模板的使用（详细版）
weixin_74923758的博客
06-11 706
在templates目录中新建一个模板文件，如index.html。
django中模板的使用
小墨蛇的博客
06-23 1378
data的数据会放到index,html。在项目的同层级下 新建模板文件夹。要想使用 需要{{key}}
Django模板
haiming0415的博客
05-13 1048
Django模板 在项目迭代流程中，前端页面都会进行大量的修改，如果将页面放到视图函数中，那么当对前端页面修改的时候，也会使得视图函数发生变化，大大加重了后端的负担。从 MTV 设计模式的角度出发，视图层是实现业务逻辑的，在视图层编写代码和编写 HTML 页面是两项可以相互独立的工作。 在 Django 中我们把 “模板” 称之为 Template，是设计模式中的 T 层，模板用于编写html代码，还可以嵌入模板代码转换更方便的完成页面开发，再通过在视图中渲染模板，将生成模板的设计实现了业务逻辑视图与显示内
django 模板 ajax,使用ajax更新django模板中局部内容的方法
weixin_42116734的博客
08-06 740
有的时候我们需要ajax中更新比较多的HTML内容，假如这些内容使用js进行拼接的话，将会非常痛苦。我找到了两个方案1.通过JsRender的方式2.后端渲染这些局部的模板内容，发送到前端，前端更新前端html这里我使用的方法2.具体操作如下：1.模板中需要更新的局部内容，单独抽离出一个html.例如:fragment.html2.在py的view中，组织fragment.html所需展现的数据，...
Django模板——模板变量
qq_42470018的博客
03-13 753
文章目录Django模板——模板变量 [^^_^]1. 简介2.使用2.1流程2.1.1视图函数传递参数2.1.2前端页面使用2.2使用规则2.3 变量解析规则2.4注意事项 Django模板——模板变量 1 1. 简介 ​ 模板变量是后台（view）传递给前端（Template）的动态变量，使用关键字content传递。 2.使用 2.1流程 2.1.1视图函数传递参数 #通过关键词...
Django配置模板引擎
brucexia的专栏
08-05 935
本节主要介绍Django框架模板层中关于配置方面的内容，包括添加模板引擎支持、模板引擎用法、内置后端和自定义后端等方面。配置模板引擎是基于Django框架进行模板层开发的基础。
Django-template:具有bootstrap 5和jquery的Django模板
04-07
Django模板-带引导 重命名您的项目 添加模型后未测试！ 确保在项目早期进行 python rename.py oldName newName 如果您没有安装烧瓶，请运行 pip3 install django or pip install django 启动服务器 python manage.py...
解决Django模板无法使用perms变量问题的方法
12-25
本文主要给大家介绍了关于Django模板无法使用perms变量的解决方法，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍吧。 解决方法： 首先,在使用Django内置权限管理系统时,settings.py文件要添加 ...
比较 Python Web 框架：Django、FastAPI 和 Flask
m0_54701273的博客
09-26 678
Python有三个受欢迎的 Web 框架：Django、FastAPI 和 Flask。作为开发者，你可能会在多个项目中面临选择哪个框架的问题。每个框架都有其独特的优点和适用场景。让我们逐一看一下它们各自的特点。
Django 依赖库管理
A乐神的博客
09-24 605
Django 依赖库管理
django创建一个新的应用
最新发布
forecasts的博客
09-29 291
命令可以在你的 Django 项目中创建一个新的应用，名为 myapp。应用是 Django 项目的组成部分，可以帮助你组织代码和功能。执行该命令后，会在你的项目目录下创建一个名为 myapp 的文件夹，包含一些基本文件和结构。接下来可以在 models.py 中定义数据库模型，在 views.py 中编写视图函数，结合 URL 路由和模板文件实现更多功能。向项目的设置文件（settings.py）中添加新应用的名称。确保你已经在 Django 项目目录中（即含有 manage.py 的目录）。
django创建项目
forecasts的博客
09-29 387
命令可以在你的计算机上创建一个新的 Django 项目，名为 myweb。这个命令的执行会在当前目录下创建一个名为 myweb 的文件夹，其中包含 Django 项目所需的基本文件和目录结构。：配置文件，用于设置 Django 项目的各种选项（如数据库配置、静态文件路径等）。：项目的 URL 路由配置文件，用于定义 URL 与视图的映射关系。：一个命令行工具，可以用来执行 Django 的各种管理命令。：项目文件夹，名字与项目相同，包含项目的配置文件。打开命令行，导航到你希望创建项目的目录。
计算机毕业设计 基于Python的医疗预约与诊断系统 Django+Vue 前后端分离 附源码 讲解 文档
weixin_19164791635
09-23 2060
本文介绍了一款基于Python、Java、SpringBoot和Vue.js技术的医疗预约与诊断系统。该系统为管理员、医生和用户提供了预约挂号、病历管理、在线咨询等功能，旨在优化医疗服务流程，提高就医效率和患者满意度，推动医疗行业的信息化发展。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

秋冬晚归客

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值