一般情况下我们在模板利用django的for标签循环生成html代码时,可以同时生成形如:

"{% url 'dormitory:hygiene_detail' pk={{ id }} %}"

的url地址,这样很容易就把参数动态的匹配到每一个url中了。

但是,如果html的代码需要js来动态的生成,再用django的for标签就不合适了。

因为for标签运用在js里,会生成大量的js代码。

因此,这就需要使用json.dumps()来把后台的dict数组转化成json数组,再在模板中使用safe过滤器来获取json数据,获取了json数据,剩下的事交给js就可以了。

但是,这种情况下,我遇到了一个头疼的问题,那就是url不能使用以下方式来传递参数了。

"{% url 'dormitory:hygiene_detail' pk={{ id }} %}"

这个时候我就想到了使用后台来传递url地址:

"href": "{% url 'dormitory:hygiene_detail' pk=" + str(id) + " %}"

这样在前台遍历json数组的时候就可以拿到href属性。

for(var i in {{ dormitory_list|safe }}){
    var item = dormitory_list[i];
    str += '<div class="dormitory-number color-0082fe" is_checked="1" href="' + item.href + '">' + item.number + '</div>';
}

在click事件里面拿到href属性实现跳转:

$('.dormitory-number').on('click', function(e){
            if($(e.target).attr('is_checked') == '1'){
                window.location.href = $(e.target).attr('href');
            }
}

...

什么?你以为这样就万事大吉了?NO NO,接下来我又发现在模板中接收到的这个url参数是个静态字符串,并未解析:

alert(url);

显示:{% url 'dormitory:hygiene_detail' pk=10 %}

想要得到的渲染结果应该是:/dormitory/hydiene_detail/10/

解决方法就是在后台传递href参数时,使用Django的Template处理一下即可:

from django.template import Context, Template
ctx['dormitory_list'].append({
                "number": 100,
                "is_checked": 1,
                "id": id,
                "href": Template("{% url 'dormitory:hygiene_detail' pk=" + str(id) + " %}").render(Context())
            })

最后一步,在click事件里面实现跳转:

$('.dormitory-number').on('click', function(e){
            if($(e.target).attr('is_checked') == '1'){
                window.location.href = $(e.target).attr('href');
            }
}

到此就万事大吉啦!

E:\qiye (gengleiming)
λ manage.py shell
Python 2.7.11 (v2.7.11:6d1b6a68f775, Dec  5 2015, 20:40:30) [MSC v.1500 64 bit (AMD64)]
Type "copyright", "credits" or "license" for more information.

IPython 5.0.0 -- An enhanced Interactive Python.
?         -> Introduction and overview of IPython's features.
%quickref -> Quick reference.
help      -> Python's own help system.
object?   -> Details about 'object', use 'object??' for extra details.

In [1]: from django.template import Context, Template

In [2]: t = Template('My name is {{ name }}.')

In [3]: c = Context({'name': 'nowamagic'})

In [4]: t.render(c)
Out[4]: u'My name is nowamagic.'

In [5]:

关于Django模板渲染一个很重要的用途的更多相关文章

  1. Django—模板渲染

    参考文档: http://www.cnblogs.com/fnng/p/4373108.html https://code.ziqiangxuetang.com/django/django-intro ...

  2. Django模板渲染

    一 . 语法 # 关于模板渲染只需要记住两种语法就可以: 1.{{ }} # 里面写变量 2.{% %} # 里面写与逻辑相关的,比如for循环 二 . 变量名 在django的模板语言中按照语法: ...

  3. 19 01 17 Django 模板 返回一个页面

    模板 问题 如何向请求者返回一个漂亮的页面呢? 肯定需要用到html.css,如果想要更炫的效果还要加入js,问题来了,这么一堆字段串全都写到视图中,作为HttpResponse()的参数吗?这样定义 ...

  4. Django模板渲染——(二)

    模板标签 模板是由HTML代码和一些逻辑控制代码组成的,逻辑控制代码除了前面介绍的变量和过滤器,还要一个非常重要的模板标签.模板标签的语法规则是{% tag %},模板标签在渲染的过程中能提供任意的逻 ...

  5. Django 模板渲染

    模板语言 {{ 变量 }} {% 逻辑 %} {{ 变量 }} {{ 变量 }}中的点号 用于取出字典/列表等类型数据的值 {{ list.2 }} 获取列表list中索引为2的值 {{ dict.n ...

  6. Django模板渲染之自定义inclusion_tag详细使用

    inclusion_tag在使用的时候可以帮我们减少很多前端和后端重复的代码 逻辑图: inclusion_tag的作用是主页面以一定的语法给一个参数,调用某个函数,这个函数可以通过主页面给的参数做一 ...

  7. python Django教程 之模板渲染、循环、条件判断、常用的标签、过滤器

    python3.5 manage.py runserver python Django教程 之模板渲染.循环.条件判断.常用的标签.过滤器 一.Django模板渲染模板 1. 创建一个 zqxt_tm ...

  8. 初学Django基础01 建立工程,目录结构,常用配置,上下文管理,模板渲染

    django是python的web重量级框架,发展已经有10年多了,对应下面版本 Django 版本 Python 版本 1.8 2.7, 3.2 , 3.3, 3.4, 3.5 1.9, 1.10 ...

  9. django模板系统基础

    模板系统基础Django模板是一个string文本,它用来分离一个文档的展现和数据 模板定义了placeholder和表示多种逻辑的tags来规定文档如何展现 通常模板用来输出HTML,但是Djang ...

随机推荐

  1. Python正则匹配递归获得给出目录下的特定类型的文件小技巧

    需求是酱的: 输入一个目录,这个目录包含检测目录的必备信息但不准确需要获得后加工一下,如给出目录:C:\Program Files\Common Files\DESIGNER,需要检测的目录是:C:\ ...

  2. JavaWeb学习笔记--filter开发

    介绍自定义的Filter类必须实现Filter接口,并且实现Filter接口定义的init() doFilter() destory()方法.其中init为初始化,destory为销毁 doFilte ...

  3. js 简单倒计时插件和使用方法

    // 倒计时插件 (function (){ function countdown(config){ var startDate = config.start ? new Date(config.st ...

  4. OC高级编程——深入block,如何捕获变量,如何存储在堆上

    OC高级编程——深入block,如何捕获变量,如何存储在堆上   首先先看几道block相关的题目 这是一篇比较长的  博文 ,前部分是block的测试题目,中间是block的语法.特性,block讲 ...

  5. 关于zMPLS的设计解析

    zMPLS是一个关于mpls标准实现的开源软件,它起源于2002年6月份,项目终止于2006年,目前它已经可以支持ipv6,ipv4,ldp,cr-ldp,rsvp,rsvp-te等MPLS协议簇.该 ...

  6. WCF的基本知识-仅Http绑定的认知

    有关WCF,这3个字母代表的含义,鄙人不会在此细说.喜欢或者不喜欢的,大家勿喷. 入正题,微软从设计.net框架开始,就一直着力于解决程序间的互通信问题.从古老的套接字(Socket)通信到后来的Re ...

  7. docker 1.10.3 里php出现 curl 56错误码问题解决

    http://www.cnblogs.com/fengwei/p/5899018.html

  8. intel安装mac os

    一.变色龙: 1.http://bbs.pcbeta.com/forum.php?mod=viewthread&tid=1518901&extra=page%3D1%26orderby ...

  9. 用BFS和DFS解决圆盘状态搜索问题

    人工智能课程的实验(我的解法其实更像是算法课程的实验) 用到的算法:深度优先搜索.宽度优先搜索(状态扩展的不同策略) 数据结构:表示状态的结构体.多维数组 (可能是最近做算法竞赛题的影响,这次并不像以 ...

  10. Android + eclipse +ADT安装完全教程

    最近几天没事做,网上看来看去突然就想弄个android来学学...  首先,是要下载android SDK,在http://developer.android.com/sdk/index.html这个 ...