Django 前后台的数据传递

严正声明:

作者:psklf
出处: https://www.cnblogs.com/psklf/p/5542612.html
欢迎转载,但未经作者同意,必须保留此段声明;必须在文章中给出原文连接;否则必究法律责任!

Django 从后台往前台传递数据时有多种方法可以实现。

最简单的后台是这样的:

from django.shortcuts import renderdef main_page(request):return render(request, 'index.html')

这个就是返回index.html的内容,但是如果要带一些数据一起传给前台的话,该怎么办呢?

一 view -> HTML 使用Django模版

这里是这样:后台传递一些数据给html,直接渲染在网页上,不会有什么复杂的数据处理(如果前台要处理数据,那么就传数据给JS处理)

Django 代码:

from django.shortcuts import renderdef main_page(request):data = [1,2,3,4]return render(request, 'index.html', {'data': data})

html使用 {{ }} 来获取数据

<div>{{ data }}</div>

可以对可迭代的数据进行迭代:

{% for item in data%}
<p>{{ item }}</p>
{% endfor %}

该方法可以传递各种数据类型,包括list,dict等等。
而且除了 {% for %} 以外还可以进行if判断,大小比较等等。具体的用法读者可以自行搜索。

二 view-> JavaScript

如果数据不传给html用,要传给js用,那么按照上文的方式写会有错误。
需要注意两点:

  1. views.py中返回的函数中的值要用 json.dumps() 处理
  2. 在网页上要加一个 safe 过滤器。

代码:
views.py

# -*- coding: utf-8 -*-import json
from django.shortcuts import renderdef main_page(request):list = ['view', 'Json', 'JS']return render(request, 'index.html', {'List': json.dumps(list),})

JavaScript部分:

var List = {{ List|safe }};

三 JavaScript Ajax 动态刷新页面

这个标题的意思是:网页前台使用Ajax发送请求,后台处理数据后返回数据给前台,前台不刷新网页动态加载数据

Django 代码:

def scene_update_view(request):if request.method == "POST":name = request.POST.get('name')status = 0result = "Error!"return HttpResponse(json.dumps({"status": status,"result": result}))

JS 代码:

        function getSceneId(scece_name, td) {var post_data = {"name": scece_name,};$.ajax({url: {% url 'scene_update_url' %},type: "POST",data: post_data,success: function (data) {data = JSON.parse(data);if (data["status"] == 1) {setSceneTd(data["result"], scece_name, td);} else {alert(data["result"]);}}});} 

JS 发送ajax请求,后台处理请求并返回status, result
success: 后面定义回调函数处理返回的数据,需要使用 JSON.parse(data)


参考资料:

Django 基础教程

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/568597.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Python爬虫】使用urllib.request下载已知链接的网络资源

如果有这样一个场景&#xff0c;我们的EXCEL某一列记录了好多&#xff08;图片、视频、音频&#xff09;链接A&#xff0c;另外一列记录了链接名称B&#xff0c;现在我们想要自动下载这些链接的文件&#xff0c;我们应该怎样处理&#xff1f; 1.循环去excel取值,将A和B存入到一…

echarts.js:1136 Uncaught Error: Initialize failed: invalid dom.

1、错误描述 echarts.js:1136 Uncaught Error: Initialize failed: invalid dom. 2、错误原因 <!DOCTYPE html><html><head><meta charset"UTF-8"><title></title><link rel"shortcut icon" href"../js/echar…

Fiddler在PC/台式对Android进行抓包

Fiddler是一个常用的http抓包工具&#xff0c;它能够记录电脑和移动端的进出数据&#xff0c;而且操作十分简便&#xff0c;下面主要介绍在台式机上Fiddler如何对Android进行数据抓包&#xff0c;本人使用的Fiddler版本为v5.0&#xff0c;文章主要知识点如下&#xff1a; 1.手机…

Echars折线配置详解

Echars折线配置详解 比如做成如下效果图&#xff1a; 所有的配置如下&#xff1a; var option {tooltip: { // 提示框trigger: axis, // 触发类型(坐标轴触发)alwaysShowContent: false, // 是否永远显示提示框的内容backgroundColor: rgba(32, 174, 252, 0.7), // 提示框…

【Python爬虫】爬取微信公众号文章信息准备工作

有一天发现我关注了好多微信公众号&#xff0c;那时就想有没有什么办法能够将微信公众号的文章弄下来&#xff0c;而且还想将一些文章的精彩评论一起搞下来。参考了一些文章&#xff0c;通过几天的研究基本上实现了自己的要求&#xff0c;现在记录一下自己的一些心得。 整个研…

js:堆栈和队列

JavaScript数组的栈和队列的操作方法。 堆栈和队列 要了解JavaScript数组的堆栈和队列方法的操作&#xff0c;需要先对堆栈和队列基础知识有所了解。在继续后面的内容之前&#xff0c;我们先简单的了解一下堆栈和队列的概念。 栈和队列都是动态的集合&#xff0c;在栈中&…

【Python爬虫】微信公众号历史文章和文章评论API分析

上一篇文章爬取微信公众号文章信息准备工作介绍了微信公众号历史文章和文章评论API的组成情况&#xff0c;历史文章API格式&#xff1a;https://mp.weixin.qq.com/mp/profile_ext?actiongetmsg&__bizMjM5NjAxOTU4MA&fjson&offset10&count10&is_ok1&sc…

MySql的Delete、Truncate、Drop分析

MySql的Delete、Truncate、Drop分析 相同点&#xff1a; truncate 和不带 where 子句的 delete&#xff0c;以及 drop 都会删除表内的数据 不同点:  1. truncate 和 delete 只删除数据不删除表的结构(定义)   drop 语句将删除表的结构被依赖的约束(constrain)、触发器(…

【Python】Python简介和Python解释器

计算机语言的种类非常的多&#xff0c;总的来说可以分成机器语言&#xff0c;汇编语言&#xff0c;高级语言三大类。 机器语言(二进制)→汇编语言→&#xff08;前面两种语言是与硬件进行交互&#xff09; →高级语言&#xff08;面向过程语言(C语言)→面向对象语言&#xff09…

python 判断当前时间是否为零点

import time time_now int(time.time()) #unix时间time_local time.localtime(time_now) #转换为win_timedt time.strftime("%H:%M:%S", time_local)# 转换成新的时间格式(18:59:20)adt.split(:)b[]for a in dt.split(:):b.append(a)c.join(b)if c000000:print(是…

多任务场景下单线程异步多线程多进程

多任务的场景&#xff1a;1.爬取不同url的内容&#xff0c;爬取同一个url分页内容。比如&#xff1a;豆瓣图书 Top 250 https://book.douban.com/top250?start0 实现豆瓣图书Top250的抓取工作&#xff0c;并存入excel中&#xff0c;如果采用的串行爬取方式&#xff0c;每次爬完…

django 按天水平分表并插入数据

db pymysql.connect("localhost", "数据库管理员名", "数据库密码", "数据库名")cursor db.cursor()unix_time str(int(time.time()))win_time datetime.datetime.now().strftime(%Y%m%d)table_name engineeringdata win_timesq…

【Python】单线程异步多线程多进程实例

上一篇文章主要介绍了多任务场景下单线程异步、多线程、多进程如何选择&#xff0c;链接&#xff1a;多任务场景下单线程异步多线程多进程 这里主要通过三个实例去验证一下简单的多任务场景下&#xff0c;三种方式的耗时情况&#xff0c;假设有10个互不关联的10个任务 多进程版…

python及pycharm2018软件安装教程

python及pycharm2018软件安装教程 python 3.6.5及pycharm2018.1.1 Win版32/64位下载地址&#xff1a; https://pan.baidu.com/s/1KdECgnrARK4HubPeFSKCTw 密码&#xff1a;bwc5 Python及PyCharm简介&#xff1a; Python 是一种面向对象的解释型计算机程序设计语言。是纯粹的自由…

【Python爬虫】requests与urllib库的区别

我们在使用python爬虫时&#xff0c;需要模拟发起网络请求&#xff0c;主要用到的库有requests库和python内置的urllib库&#xff0c;一般建议使用requests&#xff0c;它是对urllib的再次封装&#xff0c;它们使用的主要区别&#xff1a; requests可以直接构建常用的get和post…

2059 - authentication plugin 'caching_sha2_password' -navicat连接异常问题解决

使用navicat 连接 mysql 8.0.11 报 "2059 - authentication plugin caching_sha2_password ..." 解决办法&#xff1a; 进入mysql命令行然后输入 ALTER USER root% IDENTIFIED WITH mysql_native_password BY root1;

【教育】世界上最伟大的25个教育法则

鱼缸法则 心灵的成长需要自由 一家公司里&#xff0c;职员把几条小鱼放在一个鱼缸里&#xff0c;好几年了&#xff0c;鱼竟然还是那么小&#xff0c;于是大家都认为这鱼就是小个头。一天鱼缸被打破了&#xff0c;就把它们养在院子塘里&#xff0c;没想这些鱼疯了似地长得很大…

mysql安装版安装

1、到mysql官网。选择windows&#xff0c;选择.msi文件。下载 2、双击安装。安装时选择server即可ok。 3、在输入密码时&#xff0c;切记勿用小键盘上的数字&#xff08;可能会造成后期连接数据库密码错误&#xff09; 4、安装完成后&#xff0c;打开sql命令行。输入密码校正…

【测试工具】在linux测试环境安装bug管理工具禅道

在我们测试中&#xff0c;为了方便管理测试流程&#xff0c;提交测试发现的bug&#xff0c;我们需要使用到bug管理工具。有些大公司可能会自己开发一些bug管理工具&#xff0c;但是我们也会用一些开源的bug管理工具&#xff0c;比如Bugzilla&#xff0c;Redmine&#xff0c;Tra…

PyCharm点击设置没反应,无法进行设置

首先检查下是不是装了中文汉化包resources_cn.jar 如果有的话&#xff0c;解决办法&#xff1a;1.更换一个汉化包或者将原来的resources_en.jar也放进lib目录下 2.将汉化包都删除&#xff0c;只留下原版的resources_en.jar 转载自https://blog.csdn.net/xiangshangbashaon…