一般情况下我们在模板利用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. SQL语句中的乘号

    在ADO中,我们需要在SQL语句中使用乘法运算,可是添加'*'以后执行程序总是会出错,这是因为‘*’与sql中的‘*’关键字重合了,所以编译会出错. 解决办法:将乘法运算放到sql语句外面,将结果放入 ...

  2. MongoDB再实测

    不用安装,直接解压.. 这些都不是最主要的,,,倒是TOMCAT和NGINX还需要更深入的了解... http://jingyan.baidu.com/article/acf728fd3d398bf8 ...

  3. bat命令大全

    一.简单批处理内部命令简介 1.Echo 命令 打开回显或关闭请求回显功能,或显示消息.如果没有任何参数,echo 命令将显示当前回显设置.   语法 echo [{on│off}] [message ...

  4. GDB 的MI接口

    背景介绍: libgdb过时了,目前的GDB调试前端都不用libgdb 目前有两种比较流行:- MI接口,现在应该是MI II接口,是Eclipse CDT所采用的方式- emac输出接口,这个似乎有 ...

  5. 管理TEMP数据

    SQL> select * from v$mystat where rownum<2; SID STATISTIC# VALUE ---------- ---------- ------- ...

  6. BZOJ2045: 双亲数

    2045: 双亲数 Time Limit: 10 Sec  Memory Limit: 259 MBSubmit: 602  Solved: 275[Submit][Status] Descripti ...

  7. 【转】Install SmartGit via PPA in Ubuntu 13.10/13.04/12.04/Linux Mint

    原文网址:http://ubuntuhandbook.org/index.php/2013/09/install-smartgit-via-ppa-ubuntu-linux-mint/ This tu ...

  8. poj3358:欧拉定理

    又是一道用欧拉定理解的题..嗯,关键还是要建好方程,注意一些化简技巧 题目大意: 给定一个由 p / q 生成的循环小数,求此循环小数在二进制表示下的最小循环节以及不是循环节的前缀 思路: 小数化为二 ...

  9. Linux文件io--one简述

    什么是文件IO IO就是input/output,输入/输出.文件IO的意思就是读写文件. 文件操作的主要接口API 什么是操作系统API (1)API是一些函数,这些函数是由linux系统提供支持的 ...

  10. pyqt学习之列表管理器(网友提供)

    # -*- coding: utf-8 -*- __author__ = 'Administrator' import sys from PyQt4.QtCore import * from PyQt ...