(24)ajax上传json格式的数据
urs.py
from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$',views.index),
url(r'^upload_file/$',views.upload_file)
]
views.py
from django.shortcuts import render,HttpResponse
from app01 import models
from django.http import JsonResponse
# Create your views here. def index(request):
return render(request,'index.html') def upload_file(request):
'''文件上传'''
import json
dic = {'status':100,'msg':None}
if request.method == 'POST':
# post形式上传json格式数据,POST中没有值,在body中取出
upload_dic = json.loads(request.body)
name = upload_dic['name']
pwd = upload_dic['pwd']
user = models.User.objects.filter(name=name,pwd=pwd).first()
if user:
dic['msg'] = '登陆成功'
else:
dic['status'] = 101
dic['msg'] = '账号或密码错误'
# 这里注意返回一定是Json格式返回
return JsonResponse(dic)
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css">
<script src="/static/jquery.js"></script>
<title>ajax</title>
</head>
<body>
<h1>Ajan实现json格式的数据传输</h1>
<p>用户名:<input type="text" name="'name" id="name"></p>
<p>密码:<input type="password" name="pwd" id="pwd"></p>
<button id="btn2">点击登录</button>
<span id="errors"></span> </body>
<script>
$("#btn2").click(function () {
var upload_data = {name:$('#name').val(),pwd:$('#pwd').val()}
{#js语法把字典格式转成json格式字符串#}
var upload_json = JSON.stringify(upload_data)
{#js语法把json字符串转成原生的格式#}
{#var json_parse = JSON.parse(upload_data)#}
$.ajax({
url: '/upload_file/',
type: 'post',
contentType: 'application/json', //指定格式为json格式
data: upload_json,
success: function (data) {
console.log(data)
if (data.status==100){
location.href = 'http://www.baidu.com'
}else{
$('#errors').text(data.msg)
}
}
})
})
</script>
</html>
(24)ajax上传json格式的数据的更多相关文章
- Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用
1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...
- HTML5可预览多图片ajax上传(使用formData传递数据)
HTML5可预览多图片ajax上传(使用formData传递数据) 在介绍上传图片之前,我们简单的来了解下FormData的基本使用:介绍完成后这些基本知识后,我们会在文章最后提供一个demo,就是a ...
- $.ajax返回的JSON格式的数据后无法执行success的解决方法
近段时间做项目,在项目使用了ajax技术,遇到了一个奇怪的问题:"$.ajax返回的JSON格式的数据无法执行success",代码是这样写的: 1 $.ajax({ 2 .. 3 ...
- java实现服务端守护进程来监听客户端通过上传json文件写数据到hbase中
1.项目介绍: 由于大数据部门涉及到其他部门将数据传到数据中心,大部分公司采用的方式是用json文件的方式传输,因此就需要编写服务端和客户端的小程序了.而我主要实现服务端的代码,也有相应的客户端的测试 ...
- ajax上传json串格式的数据的处理 以及 js操作dom的另一种方式
- ajax往后台传json格式数据报415错误
问题描述: ajax往后台传json格式数据报415错误,如下图所示 页面代码 function saveUser(){ var uuId = document.getElementById(&quo ...
- 说说ajax上传数据和接收数据
我是一个脑袋不太灵光的人,所以遇到问题,厚着脸皮去请教大神的时候,害怕被大神鄙视,但是还是被鄙视了.我说自己不要点脸面,那是不可能的,但是,为了能让自己的技术生涯能走的更长远一些,受点白眼,受点嘲笑也 ...
- day060 ajax文件上传 json补充
请求头ContentType 文件上传时需要指定请求头,常见的类型有3种: 1.application/x-www-form-urlencoded(可以类比成在url后面拼接的形式发送,即a=1&am ...
- javascript 解析ajax返回的xml和json格式的数据
写个例子,以备后用 一.JavaScript 解析返回的xml格式的数据: 1.javascript版本的ajax发送请求 (1).创建XMLHttpRequest对象,这个对象就是ajax请求的核心 ...
随机推荐
- am335x system upgrade uboot nand boot(三)
在uboot 下初始化nand,一般需要做如下工作: 第一: 配置默认从NAND boot Index: include/configs/am335x_evm.h=================== ...
- day05 数据类型
一.整形int 基本使用: 1,用途:记录年龄\等级\各种号码 2定义方式: age=18 age =int(18) x =int(‘123’)#只能将纯数字的字符串转换成整形 print(t ...
- 阿里云服务器上安装mysql的详细步骤
阿里云安装mysql (1)下载mysql安装包,去mysql官网下载对应的包 mysql数据库官方下载网址: https://downloads.mysql.com/archives/commu ...
- [Linux]Linux下rsync服务器和客户端配置
一.rsync简介 Rsync(remote sync)是UNIX及类UNIX平台下一款神奇的数据镜像备份软件,它不像FTP或其他文件传输服务那样需要进行全备份,Rsync可以根据数据的变化进行差异( ...
- [转]如何远程连接运行OpenGL/Cuda 等GPU程序
发现一篇神文,解决了困扰许久的远程桌面OpenGL/GPU 等问题... 原地址在这:http://www.tanglei.name/how-to-run-gpu-programs-using-rem ...
- asp.net mvc 获取ajax的 request payload 参数
注意事项: 传输的格式要设置城:"contentType": "application/x-www-form-urlencoded"
- python笔记1-基础概念、python安装使用配置
Python 1.基础概念 一.什么是python? python是一种面向对象.解释型的计算机语言,它的特点是语法简洁.优雅.简单易学.在1989诞生,Guido(龟叔)开发.这里的python并不 ...
- Log4j 日志记录
关于Log4j的简单示例 <!--手动配置log4j.properties文件内容:-->1 #level:debug/info/warn/error log4j.rootLogger=O ...
- SharePoint Framework 在Visual Studio Code中调试你的本地解决方案
博客地址:http://blog.csdn.net/FoxDave Visual Studio Code不知道大家都有没有,界面清爽,编辑快速,是一个非常好的前端开发工具.本文介绍如何使用Goog ...
- SpringMVC学习四(@ModelMap @RequestBody等等的说明)
参考如下 http://www.cnblogs.com/HD/p/4107674.html http://www.cnblogs.com/qiankun-site/p/5774325.html @re ...