基于ajax提交数据
昨日回顾:
1 inclusion_tag
-干什么用的?生成html的片段(动态,传参数,传数据)
-app下新建一个模块,templatetags
-创建一个py文件(mytag.py)
-from django.template import Library
-register=Library() ----->register名字一定不能变
-写装饰器(标签,过滤器,inclusion_tag)
-@inclusion_tag('模板路径',name='重命名')
-def my_in(): 不写,写多个,不写不传,写多个,按空格来传参
- 一堆逻辑处理,查数据库
- ret=Book.object.all()
return {''books':ret}
-在模板中:
可以用books这个变量,渲染页面
-应用:
-在另一个模板中:
-{%load mytag.py%}
-{% my_in %}
2 defer,only
-defer---->除了指定字段之外
-only---->只查询几个字段
-比如:ret=Book.object.all().only('name')
-id始终会查
-结果是queryset对象,套book对象
-问:如果取price,发生了什么?
-它会再次查询数据库,对数据库造成压力
3 事务(原子性操作)
from django.db import transition
with transition.atomic():
sql1
sql2
4 choice
-模型表中某个字段,可以指定choice,用在选择不经常变的情况,经常变,尽量用数据库
user_type=models.ForeignKey(to='Info', to_field='id',db_constraint=False)
#取出对应的汉字
# author对象.user_type.name
mychoice=((1,'男'),(2,'女'),(3,'其他'))
# dd = models.ForeignKey(to='Info', to_field='id')
#取出对应的汉字
dd = models.ForeignKey(choices=mychoice)
5 反向解析
-动态获取路径(根据名字)
-路由: url(r'^inde/$', views.Test.as_view(),name='index'),
url(r'^inde/(\d+)$', views.Test.as_view(),name='index'),
-在视图层:
def mytest(request):
# 用在视图层
url=reverse('index',args=(12,))
return redirect(url)
-在模板中用:
<a href="/index/">点我跳到index页面</a>
<a href="{% url 'index' 12 %}">点我跳到index页面</a>
{#这个位置相当于放了"/inde/"#}
6 多对多的关系,三种写法
-手动创建第三张表(不创建关联关系)
class Book(models.Model):
# 默认会创建id
name = models.CharField(max_length=32)
class Author(models.Model):
name = models.CharField(max_length=32)
class Book2Author(models.Model):
id = models.AutoField(primary_key=True)
book=models.ForeignKey(to='Book',to_field='id')
author=models.ForeignKey(to='Author',to_field='id')
-不管是插入和查询,删除,都很麻烦(一般不用)
-自动创建第三张表
-查询,插入,删除,都很方便
-缺点:字段是固定的,第三张表如果要添加字段,实现不了
-手动创建第三张表,建立关联关系
class Book(models.Model):
# 默认会创建id
name = models.CharField(max_length=32)
# 中介模型,手动指定第三张中间表是Book2Author
authors=models.ManyToManyField(to='Author',through='Book2Author',through_fields=('book','author'))
class Author(models.Model):
name = models.CharField(max_length=32)
def __str__(self):
return self.name
class Book2Author(models.Model):
id = models.AutoField(primary_key=True)
book=models.ForeignKey(to='Book',to_field='id')
author=models.ForeignKey(to='Author',to_field='id')
-through:来指定我的第三张表是哪个
-through_fields:('book','author'),第一个值是:从中间表找到设置关联字段的表,通过哪个字段,第一个位置就写它
-终极总结:防止混了:关联字段就是表名小写,第一个值:就是当前表的表名小写
-查询,新增,删除,都很方便
-第三张表,可以添加别的字段
7 ajax
1 什么是ajax:异步的JavaScript和xml,跟后台交互,都用json
2 ajax干啥用的?前后端做数据交互:
3 之前学的跟后台做交互的方式:
-第一种:在浏览器窗口输入地址(get)
-第二种:用form表单提交数据
4 特点:
-异步(异步和同步的区别:同步是请求发过去,要等着回应;异步:不需要等回应,可以进行其他操作)
-局部刷新:
5 $.ajax({
url:'/index/',
type:'post',
//data:往后台提交的数据
data:{'name':'lqz','age':18},
//成功的时候回调这个函数
success:function (data) {
alert(data)
}
})
6 上传文件
模板层:
$("#btn").click(function () {
//上传文件,必须用FormData,生产一个formdata对象
var formdata=new FormData();
formdata.append('name',$("#name").val());
//取出文件$("#myfile")[0].files拿到的是文件列表,取第0个把具体的文件取出来
formdata.append('myfile',$("#myfile")[0].files[0]);
$.ajax({
url:'/files_ajax/',
type:'post',
//不预处理数据,(name=lqz&age=18)
processData:false,
//指定往后台传数据的编码格式(urlencoded,formdata,json)
//现在用formdata对象处理了,就不需要指定编码格式了,不要给我编码了
contentType:false,
data:formdata,
success:function (data) {
alert(data)
}
})
视图层:(跟form表单上传文件完全一样)
def files_ajax(request):
# 提交文件从,request.FILES中取,提交的数据,从request.POST中取
name=request.POST.get('name')
print(name)
dic_files = request.FILES
myfile = dic_files.get('myfile')
with open(myfile.name, 'wb') as f:
# 循环上传过来的文件
for line in myfile:
# 往空文件中写
f.write(line)
return HttpResponse('ok')
7 基于ajax提交json格式数据
-模板层:
$('#btn').click(function () {
var post_data={'name':$("#name").val(),'pwd':$("#pwd").val()};
console.log(typeof post_data);
// 如何把post_data这个字典,转成json格式字符串
//JSON.stringify相当于python中json.dumpus(post_data)
//pos是个字符串,json格式字符串
var pos=JSON.stringify(post_data);
console.log(typeof pos);
$.ajax({
url:'/json/',
type:'post',
data:pos,
contentType:'application/json',
success:function (data) {
//如果data是json格式字符串,如何转成对象(字典)?
//data=JSON.parse(data)
console.log(typeof data)
console.log(data)
var ret=JSON.parse(data)
console.log(typeof ret)
console.log(ret.status)
//alert(data)
}
})
})
-视图层:
def add_json(request):
if request.method=='GET':
return render(request,'json.html')
print(request.POST)
print(request.GET)
print(request.body)
import json
# res是个字典
res=json.loads(request.body.decode('utf-8'))
print(res)
print(type(res))
dic={'status':'100','msg':'登录成功'}
# return HttpResponse('ok')
# 返回给前台json格式
return HttpResponse(json.dumps(dic))
# return JsonResponse(dic)
-重点:*****
- 请求的编码方式:
contentType:'application/json',
-响应回来解析的方式
dataType:'json',
作业:
1 用户在表单输入用户名与密码,通过Ajax提交给服务器,服务器验证后返回响应信息,客户端通过响应信息确定是否登录成功,成功,则跳转到百度,否则,在页面上显示相应的错误信息location.href='http://www.baidu.com'
2 两种提交数据的方式(urlencoded,json)
3 手动创建第三张表:
详见下午
4 上课讲的敲一遍
基于ajax提交数据的更多相关文章
- 基于Ajax提交formdata数据、错误信息展示和局部钩子、全局钩子的校验。
formdata重点: 实例化FormData这个类 循环serializeArray可以节省代码量 图片要用$('#id')[0].files[0]来获得 加上contentType:false和p ...
- ThinkPHP中ajax提交数据
最近在做项目时遇到了一些需要从页面用ajax提交数据到后台的操作,无奈本人技术有限,网上苦寻,研究了一下ajax和thinkPHP的结合,黄天不负苦心人,终于搞定了. 闲话少叙,进入正题:我需要从页面 ...
- ajax提交数据
ajax提交数据 注意:获取值可以从方法参数传过来 也可以通过jquery获取对应标签的值:同时参数要与请求的动作方法的参数一致,否则值无法映射 发送 ajax (get 方式简写)请求 注 ...
- form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例
很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...
- 第一百五十九节,封装库--JavaScript,表单序列化结合ajax提交数据
封装库--JavaScript,表单序列化结合ajax提交数据 封装库,表单序列化方法 /** xu_lie_biao_dan()方法,表单序列化方法,将自动获取指定表单里面的各项字段name值和va ...
- jquery ajax提交数据给后端
大家好,今天铁柱兄给大家带一段jquery ajax提交数据给后端的教学. 初学javaweb的同学前端提交数据基本上都是用form表单提交,这玩意儿反正我是觉得不太好玩.而JavaScript aj ...
- 扩展auth_user字段、BBS需求分析、创建BBS数据库、注册页面搭建与用户头像展示及Ajax提交数据
昨日内容回顾 csrf跨站请求 1. SQL注入 2. xss攻击 3. csrf跨站请求 4. 密码加密(加盐) '''django中默认有一个中间件来验证csrf''' # 只针对post请求才验 ...
- Vue.js——基于$.ajax实现数据的跨域增删查改
概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...
- 怎样通过ajax提交数据
ajax的出现彻底改变了javascript命运,通过ajax可以直接向服务器提交数据,有两种方式: get方式,数据直接拼接在地址中 post方式,数据由data字段携带 post方式,data中是 ...
随机推荐
- 微信小程序:request合法域名检验出错,https://apis.map.qq.com 不在以下 request 合法域名列表中
设置域名 登录微信小程序后台, 设置→开发设置→服务器设置 必须设置域名,微信小程序才能进行网络通讯,不然会报错 如果没有设置合法域名,在开发阶段是可以不设置合法域名的 详情 -项目设置 好了,完美解 ...
- centos7 tomcat8+jdk1.8
(1) 下载Tomcat8压缩包进入 http://tomcat.apache.org/download-80.cgi 在binary Distributions下面,选择tar.gz包下载 [tar ...
- 20175314 《Java程序设计》第七周学习总结
20175314 <Java程序设计>第七周学习总结 教材学习内容总结 第八章:常用实用类 String()类代表字符串:Java 程序中的所有字符串字面值(如 "abc&quo ...
- 微信小程序记账本进度三
//index.jsvar util = require("../../utils/util.js"); //获取应用实例 var app = getApp(); Page({ d ...
- json转换对象中出现null属性的解决方法
前言:当数据进行json转换时,当属性值为null时,json解析就会中断,导致接下来的数据无法正确获取.原则上来讲服务器端发送的json字符串不允许存在属性值为空的情况,但是如果服务器端发送了nul ...
- linklist和arraylist区别
ArrayList更适合读取数据,linkedList更多的时候添加或删除数据.
- Django之ORM操作
Django之ORM操作 前言 Django框架功能齐全自带数据库操作功能,本文主要介绍Django的ORM框架 到目前为止,当我们的程序涉及到数据库相关操作时,我们一般都会这么搞: 创建数据库,设计 ...
- Jenkins+Gradle+Sonar进行Java项目代码分析
Jenkins+Maven+Sonar与Jenkins+Gradle+Sonar配置方法很相似,区别就是Java项目所用的编译工具不同,一个是maven,一个是gradle 使用maven编译工具的可 ...
- Collection<T> 的一个坑
当前所在的公司偏好使用 Collection<T>(System.Collections.ObjectModel), 这货比起List<T>不仅少了很多实用方法, 而且还有一个 ...
- jQuery基础方法:each(),map(),index(),is()
jQuery的each()方法和forEach()的区别: each()返回调用自身的jQuery对象,可用于链式调用 $('div').each(function(idx){ //找到所有div元素 ...