django使用ajax传输数据
HTML文件ajax get例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax get</title>
{#必须先引入jQuery库#}
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
{# jQuery ajax get 请求练习 #}
<script>
$(document).ready(function () {
$("#test").click(function () { //用id或者标签名都可以
{#$("button").click(function () {#}
$.get("/jQuery_get/",function () {
{#alert("hhah");#}
res = {{ res|safe}}; //从后台传过来的数据,必须放在这里面
console.log(res.data); //为什么没有打印出来
alert("数据:"+res.data+"\n状态:"+res.status);
});
});
});
</script>
</head>
<body>
<button id="test">测试发送一个jQuery的ajax get请求,并获取返回结果</button>
</body>
</html>
HTML文件ajax post例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax post</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript">
$(function () {
$("button").click(function () {
$.ajax({
type:"POST",
url:"/jQuery_post/",
{#加上这个传入数据不能显示alert#}
{#data:{'name':naddme},#}
{#dataType:"json",#}
success:function () {
res = {{ res|safe }}; //从后台获取的数据
{#alert("hahha")#}
alert("数据:"+res.data+"\n状态:"+res.status)
}
});
});
});
</script>
</head>
<body>
<button id="test">post请求</button>
</body>
</html>
Django后台view文件
# -*- coding: utf-8 -*-
from __future__ import unicode_literals
import json
from django.shortcuts import render def jQuery_get(request):
res = {"data": "这是后台返回的数据","status": "true"}
# 向js中传递数据必须json.dumps()处理
return render(request, 'jQuery_get.html', {'res': json.dumps(res)}) def jQuery_post(request):
res = {"data": "这是post请求后,后台返回的数据","status": "true"}
# 向js中传递数据必须json.dumps()处理
return render(request, 'jQuery_post.html', {'res': json.dumps(res)})
配置好路由后访问
django使用ajax传输数据的更多相关文章
- Django之Ajax传输数据
MTV与MVC模型 MTV与MVC都是模型,只不过MTV是django自己定义的,具体看一下他们的意思 MTV模型(django) M:模型层(models.py) T:templates文件夹 V: ...
- python Django之Ajax
python Django之Ajax AJAX,Asynchronous JavaScript and XML (异步的JavaScript和XML),一种创建交互式网页应用的网页开发技术方案. 异步 ...
- python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)
昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...
- Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件
一.Django与Ajax AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻 ...
- Django框架第九篇--Django和Ajax、序列化组件(serializers)、自定义分页器、模型表choice参数
Django和Ajax 一.什么是Ajax AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步的Javascript和XML”.即使用Javascript语 ...
- django 接受 ajax 传来的数组对象
django 接受 ajax 传来的数组对象 发送:ajax 通过 POST 方式传来一个数组 接收:django 接受方式 array = request.POST.getlist(‘key[]’) ...
- Django使用AJAX调用自己写的API接口
Django使用AJAX调用自己写的API接口 *** 具体代码和数据已上传到github https://github.com/PythonerKK/eleme-api-by-django-rest ...
- Django之Ajax提交
Ajax 提交数据,页面不刷新 Ajax要引入jQuery Django之Ajax提交 Js实现页面的跳转: location.href = "/url/" $ajax({ url ...
- Django之AJAX传输JSON数据
目录 Django之AJAX传输JSON数据 AJAX 中 JSON 数据传输: django响应JSON类型数据: django 响应 JSON 类型数据: Django之AJAX传输JSON数据 ...
随机推荐
- 摆脱Login控件,自己定义登录操作
protected void ImageButton1_Click(object sender, ImageClickEventArgs e) { //在登录过程中,程序自动使用login.aspx进 ...
- leetcode671
class Solution { public: vector<int> V; void postTree(TreeNode* node) { if (node != NULL) { V. ...
- 禁用Java JDK的自动更新
- SpringData JPA示例
SpringData JPA只是SpringData中的一个子模块 JPA是一套标准接口,而Hibernate是JPA的实现 SpringData JPA 底层默认实现是使用Hibernate 1. ...
- 解读linux中用户密码规则及忘记root口令的破解(思路)
linux当中,用户名和密码表对应关系放在/etc/passwd中,如: root:x:0:0:root:/root:/bin/bash 格式代表意义分别为 用户名:密码:用户id:组id:用户描述 ...
- webService 入门级
1,建立一个项目名为Trans,web项目,普通java项目都可以!这里我们就以简单的java应用程序来作为示范吧! 1.1在建立一个方法属于com.shu.function.Function类: / ...
- 如何建立ElasticSearch里的mappings?
刚接触elasticsearch,好多东西都不会用,百度了很多,都看不懂,终于摸索出了最简单的通过http建立mappings的方法~ 有人在建立mappings报各种错误,首先,如果你的这个索引中已 ...
- cocos2dx 触摸屏的使用
只要继承与CCLayer的类都可以实现触摸功能.CCLayer类的触摸事件的一些接口如下: // 单点触碰 virtual bool ccTouchBegan(CCTouch *pTouch, CCE ...
- 81-POJ-Wall(计算几何)
http://poj.org/problem?id=1113 Wall Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 411 ...
- 安装运行 rovio odometry
https://github.com/ethz-asl/rovio https://github.com/ethz-asl/kindr 1. 新建catkinworkspace mkdir -p ~/ ...