Django 前后台的数据传递的方法


Posted in Python onAugust 08, 2017

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

最简单的后台是这样的:

from django.shortcuts import render

def main_page(request):
  return render(request, 'index.html')

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

一 view -> HTML 使用Django模版

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

Django 代码:

from django.shortcuts import render

def 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 render
 
def 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 = 0
      result = "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)

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
打开电脑上的QQ的python代码
Feb 10 Python
python抓取网页中链接的静态图片
Jan 29 Python
python实现猜单词小游戏
May 22 Python
Python实现的简单排列组合算法示例
Jul 04 Python
pandas修改DataFrame列名的实现方法
Feb 22 Python
python aiohttp的使用详解
Jun 20 Python
如何用Python做一个微信机器人自动拉群
Jul 03 Python
Python转换itertools.chain对象为数组的方法
Feb 07 Python
python super()函数的基本使用
Sep 10 Python
详解如何修改jupyter notebook的默认目录和默认浏览器
Jan 24 Python
如何用 Python 制作 GitHub 消息助手
Feb 20 Python
Python实战之实现简易的学生选课系统
May 25 Python
关于python pyqt5安装失败问题的解决方法
Aug 08 #Python
利用Python自带PIL库扩展图片大小给图片加文字描述的方法示例
Aug 08 #Python
利用python打印出菱形、三角形以及矩形的方法实例
Aug 08 #Python
Python正则表达式非贪婪、多行匹配功能示例
Aug 08 #Python
关于Python 3中print函数的换行详解
Aug 08 #Python
Python tkinter模块中类继承的三种方式分析
Aug 08 #Python
Python实现注册登录系统
Aug 08 #Python
You might like
PHP 和 MySQL 基础教程(一)
2006/10/09 PHP
ajax在joomla中的原生态应用代码
2012/07/19 PHP
PHP图片处理之使用imagecopy函数添加图片水印实例
2014/11/19 PHP
PHP中strtr与str_replace函数运行性能简单测试示例
2019/06/22 PHP
用 JSON 处理缓存
2007/04/27 Javascript
在网页里看flash的trace数据的js类
2009/01/10 Javascript
Prototype 学习 工具函数学习($A方法)
2009/07/12 Javascript
JavaScript Cookie的读取和写入函数
2009/12/08 Javascript
JavaScript 学习笔记二 字符串拼接
2010/03/28 Javascript
AeroWindow 基于JQuery的弹出窗口插件
2011/06/27 Javascript
使用js获取地址栏中传递的值
2013/07/02 Javascript
表单元素与非表单元素刷新区别详细解析
2013/11/06 Javascript
深入理解JavaScript系列(37):设计模式之享元模式详解
2015/03/04 Javascript
jquery读取xml文件实现省市县三级联动的方法
2015/05/29 Javascript
js实现基于正则表达式的轻量提示插件
2015/08/29 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
2016/01/04 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
2016/10/31 Javascript
详解使用webpack打包编写一个vue-toast插件
2017/11/08 Javascript
Vue拖拽组件列表实现动态页面配置功能
2019/06/17 Javascript
angularjs自定义过滤器demo示例
2019/08/24 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
vue 在单页面应用里使用二级套嵌路由
2020/12/19 Vue.js
[02:41]DOTA2英雄基础教程 冥魂大帝
2014/01/16 DOTA
[05:48]DOTA2英雄梦之声vol21 屠夫
2014/06/20 DOTA
[02:58]魔廷新尊——痛苦女王至宝语音台词节选
2020/06/14 DOTA
Python使用tablib生成excel文件的简单实现方法
2016/03/16 Python
Django卸载之后重新安装的方法
2017/03/15 Python
Python+threading模块对单个接口进行并发测试
2019/06/25 Python
Python3之乱码\xe6\x97\xa0\xe6\xb3\x95处理方式
2020/05/11 Python
Linux面试题LINUX系统类
2014/11/19 面试题
国际贸易专业推荐信
2013/11/15 职场文书
七一党建活动方案
2014/01/28 职场文书
献爱心捐款倡议书
2014/05/14 职场文书
清明扫墓感想
2015/08/11 职场文书
九年级化学教学反思
2016/02/22 职场文书