Django中的Ajax

Django 是由 Python 开发的一个免费的开源网站框架,可以用于快速搭建高性能,优雅的网站!

AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

AJAX 不是新的编程语言,而是一种使用现有标准的新方法。

AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

Ajax

  很多时候,我们在网页上请求操作时,不需要刷新页面。实现这种功能的技术就要Ajax!

jQuery中的ajax就可以实现不刷新页面就能向后台请求或提交数据的功能,我们仍然用它来做django中的ajax,所以先把jquey下载下来,版本越高越好。

一、ajax发送简单数据类型:

html代码:在这里我们仅发送一个简单的字符串

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-">
<title></title>
</head>
<body>
<input type="button" onclick="AjaxSubmit();" value="提交">
<script src="/static/jquery-...min.js"></script>
<script>
function AjaxSubmit(){
var host = '...';
var port = '';
$.ajax({
url:"/app/ajax_submit/",
type:'POST',
data:{host:host,port:port},
success: function (arg) {
}
});
}
</script>
</body>
</html> 

django下app里views.py

# coding:utf-8
from django.shortcuts import render,HttpResponse
def ajax_submit(request):
print request.POST #客户端发来的数据
return render(request,'ajax_submit.html') 

打印出来的数据样式:

二、ajax发送复杂的数据类型:

html代码:在这里我们仅发送一个列表中包含字典数据类型

由于发送的数据类型为列表 字典的格式,我们提前要把它们转换成字符串形式,否则后台程序接收到的数据格式不是我们想要的类型,所以在ajax传输数据时需要JSON

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-">
<title></title>
</head>
<body>
<input type="button" onclick="AjaxSubmit_set();" value="提交集合">
<script src="/static/jquery-...min.js"></script>
<script>
function AjaxSubmit_set(){
var data_list = [
{'name':'chenchao','age':},
{'name':'lisi','age':},
{'name':'wangwu','age':}
];
$.ajax({
url:"/app/ajax_submit_set/",
type:'POST',
tradition:true, 原生模式
data:{data:JSON.stringify(data_list)},
success: function (arg) {
}
});
}
</script>
</body>
</html> 

django下app里views.py

def ajax_submit_set(request):
print request.POST
return render(request,'ajax_submit.html') 

打印出来的数据样式:

三、稍等、还没完。

虽然我们实现了功能,但这还不够,因为显得不是很专业,所以我们稍作处理。

success: function (arg) { } 如果ajax提交数据成功,那么就会自动执行这里面的函数

html代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-">
<title></title>
</head>
<body>
<input type="button" onclick="AjaxSubmit();" value="提交">
<input type="button" onclick="AjaxSubmit_set();" value="提交集合">
<script src="/static/jquery-...min.js"></script>
<script>
function AjaxSubmit(){
var host = '...';
var port = '';
$.ajax({
url:"/app/ajax_submit/",
type:'POST',
data:{host:host,port:port},
success: function (arg) {
}
});
}
function AjaxSubmit_set(){
var data_list = [
{'name':'chenchao','age':},
{'name':'lisi','age':},
{'name':'wangwu','age':}
];
$.ajax({
url:"/app/ajax_submit_set/",
type:'POST',
tradition:true,
data:{data:JSON.stringify(data_list)},
success: function (arg) { //如果程序执行成功就会执行这里的函数
var callback_dic = $.parseJSON(arg);
if(callback_dic.status){
alert('成功');
}else{
alert(callback_dic.error); //把错误的信息从后台提出展示出来
}
}
});
}
</script>
</body>
</html> 

django下app里views.py

# coding:utf-
from django.shortcuts import render,HttpResponse,redirect
def ajax_submit(request):
print request.POST
return render(request,'ajax_submit.html')
import json
def ajax_submit_set(request):
ret = {'status': True,'error': ""}
try:
print request.POS
except Exception, e:
ret['status'] = False
ret['error'] = str(e)
j_ret = json.dumps(ret)
return HttpResponse(j_ret)

Django中ajax的使用

前端的ajax代码如下所示:

$.ajax({
type:'GET',
url:'/store/ds_mgmt_wx/ajax_handle',
dataType:'html',
success:function(data)
{
alert(data);
},
error:function(data)
{
alert(data);
}
});

后端的相应代码的返回方法如下:

if act_job == 'ajax_handle':
return HttpResponse('ajax_handle')

关于Django中的Ajax小编就给大家介绍到这里,希望对大家有所帮助!

(0)

相关推荐

  • python Django模板的使用方法(图文)

    模版基本介绍模板是一个文本,用于分离文档的表现形式和内容. 模板定义了占位符以及各种用于规范文档该如何显示的各部分基本逻辑(模板标签). 模板通常用于产生HTML,但是Django的模板也能产生任何基于文本格式的文档.来一个项目说明1.建立MyDjangoSite项目具体不多说,参考前面.2.在MyDjangoSite(包含四个文件的)文件夹目录下新建templates文件夹存放模版.3.在刚建立的模版下建模版文件user_info.html 复制代码 代码如下: <html>    <

  • python Django连接MySQL数据库做增删改查

    1.下载安装MySQLdb类库http://www.djangoproject.com/r/python-mysql/2.修改settings.py 配置数据属性 复制代码 代码如下: DATABASES = {    'default': {        'ENGINE': 'django.db.backends.mysql', # Add 'postgresql_psycopg2', 'mysql', 'sqlite3' or 'oracle'.        'NAME': 'djang

  • Python的Django应用程序解决AJAX跨域访问问题的方法

    引子 使用Django在服务器端写了一个API,返回一个JSON数据.使用Ajax调用该API: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width

  • django+js+ajax实现刷新页面的方法

    本文实例讲述了django+js+ajax实现刷新页面的方法.分享给大家供大家参考,具体如下: 在服务器开发的时候,为了方便将服务器对外开一个接口来操作,可以使用django制作网页,通过页面来操作服务器.这样可以将服务器的维护工作暴漏在更加友好的界面操作,而非通过SecureCRT去敲指令.而且还能提供给策划运维人员来处理一些常规的事情. 这里将会讲解一个非常小的知识点: ① js如何发起一次请求 ② django如何响应请求 ③ js接收到响应如何区域刷新页面 js部分 我们先在html中定

  • 使用Python的Django框架结合jQuery实现AJAX购物车页面

    Django中集成jquery 首先,静态的资源通常放入static文件夹中: static/ css/ djquery.css samples/ hello.css js/ jquery-1.7.1.min.js samples/ hello.js 其中css和js都按照应用名称(这里是samples)划分文件夹,如果文件较多,还可以再划分子文件夹. Django通常使用模板来展现html,而且我们通常使用继承的模板,所以需要将共用的元素,比如全局的css,对jquery.js的引入等,写到b

  • Django框架如何使用ajax的post方法

    Django是一个开放源代码的Web应用框架,由Python写成.采用了MVC的软件设计模式,即模型M,视图V和控制器C.它最初是被开发来用于管理劳伦斯出版集团旗下的一些以新闻内容为主的网站的,即是CMS(内容管理系统)软件.并于2005年7月在BSD许可证下发布.这套框架是以比利时的吉普赛爵士吉他手Django Reinhardt来命名的. 今天在尝试调用jQuery的ajax时发现一个问题,就是使用GET方法服务器可以正常返回,但是使用POST方法却不行.后来再测试表单方式的POST的方法也

  • 详解Django中Request对象的相关用法

    从Request对象中获取数据 我们在第三章讲述View的函数时已经介绍过HttpRequest对象了,但当时并没有讲太多. 让我们回忆下:每个view函数的第一个参数是一个HttpRequest对象,就像下面这个hello()函数: from django.http import HttpResponse def hello(request): return HttpResponse("Hello world") HttpRequest对象,比如上面代码里的request变量,会有一

  • 教你安装python Django(图文)

    安装环境:python版本2.7.5 ,win7系统安装Djangohttps://www.djangoproject.com/download/ 官方下载Django-1.5.5.tar.gz1,解压后(我的目录是D:\myapp\Django-1.5.5)2,DOS命令到刚解压后的Django-1.5.5目录下执行命令 python setup.py install , 结果如下图: 说明:Django安装命令实际是将Django复制到本地Python安装目录D:\Python27\Lib\

  • Python+Django在windows下的开发环境配置图解

    1         安装配置开发环境 1.1   准备安装 下载以下软件 Eclipse for C/C++ SUN JDK 1.6 不一定要1.6,1.5的也可以 Python3.1  Python2.6.4  Pythone2.5.2 mod_python-3.3.1.win32-py2.5-Apache2.2 MySQL-python-1.2.2.win32-py2.5 pysqlite-2.5.5.win32-py2.5 python.pydev.feature-1.5.0.125198

  • django通过ajax发起请求返回JSON格式数据的方法

    本文实例讲述了django通过ajax发起请求返回JSON格式数据的方法.分享给大家供大家参考.具体实现方法如下: 这是后台处理的: def checkemail(request): user = None if request.POST.has_key('email'): useremail = request.POST['email'] result = {} user = User.objects.filter(useremail__iexact = useremail) if user:

  • django中使用jquery ajax post数据出现403错误的解决办法(两种方法)

    在django中,使用jquery ajax post数据,会出现403的错误 方法一: 如果用jQuery来处理ajax的话,Django直接送了一段解决问题的代码.把它放在一个独立的js文件中,在html页面中都引入即可.注意这个js文件必须在jquery的js文件引入之后,再引入即可 $(document).ajaxSend(function(event, xhr, settings) { function getCookie(name) { var cookieValue = null;

随机推荐