转自:http://www.cnblogs.com/python-study/p/6060530.html

1.使用Ajax在后台传递参数的示例

  要使用Ajax传递参数,需要使用jquery,使用jquery需要注意以下几点。

  1.建立static的目录,将jquery导入

  

  2.在项目s13day18_django的settings配置中,指定jquery的目录,同时注释掉CSRF

STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR,'static'),
)
# 'django.middleware.csrf.CsrfViewMiddleware',

  3.在app01下面,指定路由关系

urlpatterns = [
# url(r'^index/(\d+)/', views.index),
# url(r'^detail/(\d+)/',views.detail),
# url(r'^template/',views.template),
url(r'^extend/',views.extend),
url(r'^assets/',views.assets),
url(r'^userinfo/',views.userinfo),
url(r'^ajax_demo/',views.ajax_demo),
]

  4.在app01下面,定义ajax_demo函数

def ajax_demo(request):
if request.method == 'POST':
user = request.POST.get('user')
pwd = request.POST.get('pwd')
print(user,pwd)
if user == '111' and pwd == '222':
return HttpResponse('1')
else:
return HttpResponse('2')
return render(request,'ajax_demo.html')

  5.在templates中,添加关于ajax_demo的HTML信息

<body>
<div>
<p>用户名: <input type="text" id="username" /></p>
</div>
<div>
<p>密码: <input type="password" id="pwd" /></p>
</div>
<input type="button" value="提交" onclick="SubmitForm();"/> <script src="/static/jquery-1.12.4.js"></script>
<script>
function SubmitForm(){
$.ajax({
url:'/web/ajax_demo/',
type:'POST',
data:{'user':$('#username').val(),'pwd':$('#pwd').val()},
success:function(data){
if(data == '1'){
location.href="http://www.baidu.com";
}
else{
alert("用户名或密码错误")
}
}
})
}
</script>
</body>

  整个执行的过程是,ajax传递参数给了函数ajax_demo,函数获取到用户键入的值,然后通过HttpResponse返回给回调函数success,回调函数再执行相应的操作。

====================================================================================================  但是在实际的使用中,我们要这么定义views.py

import json
def ajax_demo(request):
if request.method == 'POST':
ret = {'status':False,'message':''}
user = request.POST.get('user')
pwd = request.POST.get('pwd')
print(user,pwd)
if user == '111' and pwd == '222':
ret['status'] = True
return HttpResponse(json.dumps(ret))
else:
ret['message'] = '用户名或密码错误'
return HttpResponse(json.dumps(ret))
return render(request,'ajax_demo.html')

  ajax_demo.html

<body>
<div>
<p>用户名: <input type="text" id="username" /></p>
</div>
<div>
<p>密码: <input type="password" id="pwd" /></p>
</div>
<input type="button" value="提交" onclick="SubmitForm();"/> <script src="/static/jquery-1.12.4.js"></script>
<script>
function SubmitForm(){
$.ajax({
url:'/web/ajax_demo/',
type:'POST',
data:{'user':$('#username').val(),'pwd':$('#pwd').val()},
dataType:'json',
success:function(data){
if(data.status){
location.href="http://www.baidu.com";
}
else{
alert(data.message)
}
}
})
}
</script>
</body>

  如果不用ajax自带的dataType类型,也可以自己将json的格式转化为字典格式:

    <script src="/static/jquery-1.12.4.js"></script>
<script>
function SubmitForm(){
$.ajax({
url:'/web/ajax_demo/',
type:'POST',
data:{'user':$('#username').val(),'pwd':$('#pwd').val()},
{# dataType:'json',#}
success:function(data){
var data_dic = JSON.parse(data);
if(data_dic['status']){
location.href="http://www.baidu.com";
}
else{
alert(data_dic['message'])
}
}
})
}
</script>

  JQuery中的ajax也是调用了浏览器中的XMLHttpRequest对象来执行的。

  http://www.cnblogs.com/wupeiqi/articles/5703697.html

python Ajax的使用的更多相关文章

  1. python -- ajax数组传递和后台接收

    phper转pythoner 在当初使用php做网站开发的时候,前端ajax传递数据的时候,就是直接将一个数组传递过去,后台用$_POST['key']接收即可,没有考虑那么细,想来这不都是理所当然的 ...

  2. python Ajax

    Ajax一.准备知识JSON1.什么是json JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻量级的文本数据交换格式 JSO ...

  3. python ajax post 数据

    简单的html <div> <input type="submit" id="tes" value="tes"> & ...

  4. JSON 的正确用法:Python、MongoDB、JavaScript与AjaxJSON 的正确用法:Python、MongoDB、JavaScript与Ajax

    本文主要总结网站编写以来在传递 JSON 数据方面遇到的一些问题以及目前采用的解决方案.网站数据库采用 MongoDB,后端是 Python,前端采用“半分离”形式的 Riot.js,所谓半分离,是说 ...

  5. My First Django Project - <Django + MySQL + Ajax> (1)

    因为最近工作有些信息需要额外花时间去收集,但是现在有相关的operations每天记录状态,但是没有一个很好的状态收集工具,将状态收集起来,所以很多情况下我们不知道是状态变好了,还是变差.如果使用EX ...

  6. python 各种开源库

    测试开发 来源:https://www.jianshu.com/p/ea6f7fb69501 Web UI测试自动化 splinter - web UI测试工具,基于selnium封装. 链接 sel ...

  7. python 三方面库整理

    测试开发 Web UI测试自动化 splinter - web UI测试工具,基于selnium封装. selenium - web UI自动化测试. –推荐 mechanize- Python中有状 ...

  8. Python 总结

    python3.7下载地址 Python安装pip 1.首先检查linux有没有安装python-pip包,直接执行 yum install python-pip 2.没有python-pip包就执行 ...

  9. Python测试 ——开发工具库

    Web UI测试自动化 splinter - web UI测试工具,基于selnium封装. selenium - web UI自动化测试. mechanize- Python中有状态的程序化Web浏 ...

随机推荐

  1. [题解] 洛谷P3950 部落冲突

    传送门 拿到题目,一看 裸LCT (其实是我懒得打,splay又臭又长) 首先,这道题的意思就是删掉一些边 所以常规操作 点权转边权 之后对于战争操作,在对应的边上+1 对于和平操作,在对应的边上-1 ...

  2. 机器学习分布式框架horovod安装 (Linux环境)

    1.openmi 下载安装 下载连接: https://download.open-mpi.org/release/open-mpi/v4.0/openmpi-4.0.1.tar.gz 安装命令 1 ...

  3. 同时运行两个版本相同的tomcat

    由于项目需要,代理集群和一个节点都部署在本地,那么就需要有两个tomcat,一个部署集群,一个部署项目,我都用了7.0.34版本的tomcat 当启动代理的tomcat成功时,再启动节点的tomcat ...

  4. SpringBoot项目示例

    一.准备工作: 环境及工具:Eclipse+JDK8+Maven+SpringBoot 二.源码: 1.项目架构:                    2.引入pom.xml <project ...

  5. windows之anaconda导入torch失败和pip install命令执行read time out

    昨天用jupyter导入torch还好好的呢,今天用就不行了,先是ImportError: DLL load failed: 找不到指定的模块.再是No such comm target regist ...

  6. 《深入理解java虚拟机》-目录结构

    第一部分 走进Java第1章 走进Java 第二部分 自动内存管理机制 第2章 Java内存区域与内存溢出异常2.1 概述2.2 运行时数据区域2.2.1 程序计数器2.2.2 java虚拟机栈2.2 ...

  7. 牛客寒假算法基础集训营1B题

    链接:https://ac.nowcoder.com/acm/contest/317/B 来源:牛客网 题目描述 小a非常喜欢204204这个数字,因为′a′+′k′=204′a′+′k′=204. ...

  8. python 3.6

    安装了最新版anaconda3-4.3 发现jupyter-notebook 少了一些东西.需要手工安装 https://github.com/Anaconda-Platform/nbpresent

  9. java多线程高并发的学习

    1.      计算机系统 使用高速缓存来作为内存与处理器之间的缓冲,将运算需要用到的数据复制到缓存中,让计算能快速进行:当运算结束后再从缓存同步回内存之中,这样处理器就无需等待缓慢的内存读写了. 缓 ...

  10. random mating

    随机交配种群 孟德尔分离(基于diploid and sexual)和随机交配(1.不因突变而改变的规律2.可计算的)是群体遗传学的基础. 随机交配(random mating)指群体中每一个成员与另 ...