jinjia模板和ajax,Django ajax中如何使用jinja2的标签_LA05hiren的博客-程序员宅基地

技术标签: jinjia模板和ajax  

我有个作孽的功能,联动查询

bVbjDtz?w=1964&h=648

下拉选择服务器之后,把所符合的内容查询出来,通过ajax回填回去

bVbjDuG?w=1924&h=606

其中ajax代码

$('#group_id').change(function () {

var group_id = $("#group_id").val();

$.ajax({

data: {'group_id': group_id, csrfmiddlewaretoken: '{ { csrf_token }}'},

type: 'POST',

url: '/pro1/gamebuild/' + group_id + '/',

success: function (data) {

var json_data = JSON.parse(data);

var content = '';

$.each(json_data, function (i, item) {

content += '

' + item.groupname + ' ' +

'

' + item.game_name + ' ' +

'

' +

'' +

' ' + item.version+''+

'

'

});

$("#ossfile-tab-body").html(content)

}

})

});

content 这里就是回填的

那我现在想要在这里里面添加jinja2的语法,试了几种都不行的

{%if xxx %}{% endif %}

类似这样的,但都没法生效

content += '

' + item.groupname + ' ' +

'

' + item.game_name + ' ' +

'

' +

'' +

' ' + {% if item.version == "trunk" %}item.version {% elif item.version == "branch" %}ddd{% endif %}+''+

'

'

bVbjDwC?w=1838&h=702

像这种的应该怎么写法。

另外,像这种联动查询的,还有什么好的方法

现在基本都是选择查询,然后服务端返回一个list给ajax,ajax再进行拼接html渲染

感觉这种 js 拼接的 html好难写,各种单引号,双引号 ` " 搞的好乱,还要再拼接jinja2的内容,就更折腾了

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_35398720/article/details/119437521

智能推荐

开源日志框架有哪些(科普)_柏拉图的稻穗的博客-程序员宅基地_开源日志框架

1.JDK LoggerJDK从1.4版本开始自带的一套日志系统JDK Logger,最大优点就是不需要集成任何类库,只需要JVM的运行环境,就可以直接使用。日志级别分为九个:all、finest、finer、config、info、warning、severe、off,级别依次升高,这里和主流的开源日志框架命名不同,例如:主流日志框架的错误日志使用error命名,而这里使用severe命名。...

IBM Blockchain Platform (2) IBM Cloud 及 Kubernetes 集群的安装_骨骼惊奇不信邪的博客-程序员宅基地

本文是基于IBM Cloud 官网教程进行的一些操作及截图目录1. 创建 IBM Cloud账户并升级2. 创建 kubernetes集群:3. 安装 IBM Cloud CLI3.1 下载 IBMCloud CLI3.2 配置环境变量3.3 安装插件4. 安装Kubernetes CLI(Kubectl)5. 通过CLI链接5.1 ibm cloud 登录5.2 将 Kubernetes 上下文设置为您的集群5.3 验证您是否可以连接到集群1. 创建..

【webrtc】openh264编码:QP 解析_等风来不如迎风去的博客-程序员宅基地_openh264源码分析

RTMP 推流是需要SPS PPS 生成avc specifc header的 。【webrtc】openh264编码:SPS PPS 策略但是,QP 是可以编码器设置的,webrtc在QOS 策略会调整QP, QP阈值的下限、上限默认分别为:24、37。编码完毕后,webrtc 还要专门做QP 解析,通过上层StreamEncoder接口给到QualityScaler 中做决策。解析类是 BitstreamParserH.264 解析类:H264BitstreamParser webr.

java用lambda函数排序,Java8:使用Lambda表达式增强版Comparator排序_咪马3213�mkq~的博客-程序员宅基地

学习路上的自我记录-------路好长,就问你慌不慌,大声港,不慌。----jstarseven。实体类:package com.server.model;/*** Created by jstarseven on 2016/3/21.*/public class Human {private String name;private int age;@Overridepublic String t...

分享一下我收集到的好用的网址_言云上于天的博客-程序员宅基地_谁有那种网址分享一下的吗

收集到的好用的实用的网址大学四年,折腾了好多网址,今天来记录在我的博客里做一个分享先来看看我平时的书签我会根据自己的需求把网址进行一个分类,方便管理,也很好看直接上网址1、在线PDF转换工具链接: link2、在线颜色代码转换工具和谷歌表情链接: link链接:link3、高精度的IP定位工具链接:link4、两个视频素材网址链接:link链接:link链接:link...

Ubuntu VS Code 使用Source code pro 字体_花洛兮灬的博客-程序员宅基地

Ubuntu VS Code 使用Source code pro 字体1.安装Source code pro 字体下载字体https://www.fontsquirrel.com/fonts/source-code-pro在/usr/share/fonts目录下新建目录sudo mkdir /usr/share/fonts/opentype将下载的安装包解压到opentype文件夹中sudo unzip -d /usr/share/fonts/opentype/ source-code-p

随便推点

array_unique() 删除数组中重复的值_xu776061375的博客-程序员宅基地

实例移除数组中重复的值:定义和用法array_unique() 函数用于移除数组中重复的值。如果两个或更多个数组值相同,只保留第一个值,其他的值被移除。注释:被保留的数组将保持第一个数组项的键名类型。语法array_unique(array)参数 描述 array 必需。规定数组。 sortingtype 可选。规定排序类型。可能的值: SORT_STRING - 默认。把每一项作为字符串来处理。 SORT_REGULAR - ..

Android APP 小工具测试“利器”_BenjaminQA的博客-程序员宅基地

项目地址:https://github.com/Github-Benjamin/AndroidDevicesAPPInfo项目简介:Android 测试小工具基于Maven的Java Swing GUI桌面应用开发并集成adb命令完成应用程序信息快速查看,工具的主要用途用于快速获取安卓设备当前正在运行的最顶层APP的相关信息,如:PackName、PackBit、Launchable_Act...

@CrossOrigin Enabling CORS_点滴1993的博客-程序员宅基地

在spring 4.2后,提供了跨域注解@CrossOriginhttps://spring.io/guides/gs/rest-service-cors/Enabling CORSController method CORS configurationSo that the RESTful web service will include CORS acces

[转]Xmanager连接Linux远程桌面(后面添加了自己的部分)_weixin_30426957的博客-程序员宅基地

Xmanager连接Linux远程桌面(图文详解+亲自测试)   我用的是RedHat Enterprise Linux 5.4和最新的Xmanager Enterprise3.0。首先先来了解一下什么是Xmanager。Xmanager全称Netsarang Xmanager,是国外一套非常优秀的远程监控软件。在UNIX/Linux和Windows网络环境中,Xmanager是最好的连通解决...

【好人修电脑系列】MatLab7在windows7,windows8中安装问题摘要_chiqiandeng1612的博客-程序员宅基地

具体的错误代码就不发了,具体是两点: 修改改环境变量:新建变量名:BLAS_VERSION 变量值:D:\matlab7\bin\win32\atlas_Athlon.dll在你的安装文件夹里搜索atlas_Athlon.dll,记好它的路径,用‘(路径名)\atlas_Athlon.dll...

推荐文章

热门文章

相关标签