django框架 day07

今日内容:

1.choices字段(也可以成为参数)

2.MTV与MVC模型

3.contentType前后端传输数据编码格式

4.Ajax

5.序列化组件

6.Ajax结合sweetalert组件

7.自定义分页器的使用

1.choices字段(也可以称为参数)

建立一个对应关系的,比如说有一个性别字段,分为男和女,你写字符比较占用资源,
可以用数字来代表,用choices来建立一个对应关系,比如说0代表男,1代表女,
这样数量一旦多了起来,就大大的节省了资源。

代码实现:models里面

class User(models.Model):
    username = models.CharField(max_length=32)
    age = models.IntegerField()
    choices = (
        (1,''),(2,''),(3,'其他')
    )
    gender = models.IntegerField(choices=choices)
1 存choice里面罗列的数字与中文对应关系
print(user_obj.get_gender_display())
只要是choices字段 在获取数字对应的注释 固定语法
get_choices字段名_display()

2 存没有罗列出来的数字
不会报错 还是展示数字


测试文件:tests里面
固定写法
user_obj = models.User.objects.filter(pk=7).first()

print(user_obj.get_gender_display())
"""
只要是choices字段 在获取数字对应的注释 固定语法
get_choices字段名_display()
"""

2.MTV与MVC模型

MTV与MVC模型
    django框架 自称为是MTV框架
        M:models
        T:templates
        V:views

    MVC
         M:models
         V:views
         C:controller 控制器(urls)

ps:
本质上MTV其实也是MVC    

3.contentType前后端传输数据编码格式

前后端传输数据编码格式
1.urlencoded
2.formdata
3.json

form表单:

默认使用的编码和格式是urlencoded
    数据的格式:name=jason&pwd=123  就是什么等于什么

    django后端针对urlencoded编码格式的数据会自动解析并放到request.POST中供用户获取
    
我们也可以修改为formdata 来传文件:
django后端针对只要是符合urlencoded编码格式的数据(name=jason&pwd=123)都会自动解析并放到request.POST中供用户获取

如果是文件 只要你指定的编码是formdata 就会自动解析并放到request.FILES中
总结:前后端传输数据的时候 一定要保证数据格式和你的编码格式是一致的 不能骗人家!!!
前端代码:
1 <form action="" method="post" enctype="multipart/form-data">
2     username:<input type="text" name="name">
3     password:<input type="text" name="pwd">
4     info:<input type="file" name="myfile">
5     <input type="submit">
6 </form>
View Code
 
 

后端代码:

1 def index(request):
2     # 验证前后端传输数据的编码格式
3     if request.method == 'POST':
4         print('request.POST',request.POST)
5         print('request.FILES',request.FILES)
6     return render(request,'index.html')
View Code

Ajax提交数据:

ajax默认数据提交方式也是urlencoded        
ajax发送json格式数据

django后端针对json格式的数据 并不会自动解析放到request.POST或者request.FILES里面
它并不会解析json格式数据 而是将它原封不动的放在request.body中了

4.Ajax简介:

AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步的Javascript和XML”。
即使用Javascript语言与服务器进行异步交互,传输的数据为XML(当然,传输的数据不只是XML)。 AJAX 不是新的编程语言,而是一种使用现有标准的新方法。 AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
(这一特点给用户的感受是在不知不觉中完成请求和响应过程) AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。

同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求; 异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。

简单来说:

异步提交,局部刷新

请求方式 GET  POST
    a标签href属性    GET请求
    浏览器窗口输入url   GET请求
    form表单     GET/POST
    Ajax     GET/POST

首先Ajax这门技术是js中的,但是原生的js操作Ajax比较繁琐,我们这里为了提高效率,直接使用jQuery封装版本的Ajax

Ajax基本语法:
url:提交的地址(不写的话就朝当前的地址发送)
type:提交的方式
data:提交的数据
success:回调函数

基于Ajax写一个小列子:

页面上有三个input框
在前两个input框中输入数字
点击按钮 发送ajax请求 不刷新页面的情况下
第三个框中自动算出两数之和

前端:

 1 <input type="text" id="i1">+<input type="text" id="i2">=<input type="text" id="i3">
 2 <button id="b1">求和</button>
 3 
 4 
 5 <script>
 6     $('#b1').on('click',function () {
 7         //点击按钮 朝后端发送post请求
 8         $.ajax({
 9             url: '', // 控制发给谁,不写就是朝当前地址提交
10             type: 'post', //发送方式是post请求
11             data:{'i1':$('#i1').val(),'i2':$('#i2').val()}, // 发送的数据,点val是拿到input框里面的值
12             success:function (data) { //data形参是用来接收异步提交的结果的 ,回调函数
13                 {#alert(data)#}
14                 //将后端计算好的结果,通过DOM操作,渲染到第三个input框中
15                 $('#i3').val(data)
16             }
17         })
18     })
View Code

后端:

 1 def index(request):
 2     # print(request.is_ajax())  # 可以用来判断当前请求方式是否为ajax请求
 3     if request.is_ajax():
 4         if request.method == 'POST':
 5             # 获取提交过来的数据,然后进行相加
 6             i1 = request.POST.get('i1')
 7             i2 = request.POST.get('i2')
 8             # 不能直接相加,因为后端获取的前端数据,都是字符串格式
 9             res = int(i1) + int(i2)
10             return HttpResponse(res)
11     return render(request,'index.html')
View Code

Ajax提交json格式的数据:

ajax默认数据提交方式也是urlencoded    
ajax发送json格式数据

django后端针对json格式的数据 并不会自动解析放到request.POST或者request.FILES里面
它并不会解析json格式数据 而是将它原封不动的放在request.body中了

需要注意的点:前端

1.你需要告诉后端这次你提交的是json格式的数据:

contentType:'application/json'
2.你需要把你的数据转为json格式,因为前后端传输数据的话,一定要保证数据格式和你的编码格式是一致的
后端要注意的点:
1.后端接收数据的时候,必须要自己处理一下数据,数据再body里面,先解码,然后在loads反序列化一下

前端代码:
 1   
 2 <input type="text" id="i1">+<input type="text" id="i2">=<input type="text" id="i3">
 3 <button id="b1">求和</button>
 4 
 5   $('#b1').on('click',function () {
 6     //点击按钮 朝后端发送post请求
 7     $.ajax({
 8         url: '', // 控制发给谁,不写就是朝当前地址提交
 9         type: 'post', //发送方式是post请求
10         data:JSON.stringify({'username':'zy','password':123}), // 发送json格式的数据,需要明确的指定一下
11         contentType:'application/json',//告诉后端你这次的数据是json格式
12         success:function (data) { //data形参是用来接收异步提交的结果的 ,回调函数
13             {#alert(data)#}
14             //将后端计算好的结果,通过DOM操作,渲染到第三个input框中
15             $('#i3').val(data)
16         }
17     })
18 })
View Code

后端代码:

 1 def index(request):
 2        
 3     if request.method == 'POST':
 4         print('request.POST',request.POST)
 5         print('request.FILES',request.FILES)
 6         # print(request.body)  # 打印出来是二进制数据
 7         # 后端需要手动去request.body中获取json格式数据,然后自己处理
 8         json_str = request.body
 9         import json
10         dic_bytes = json_str.decode('utf-8')
11         rel_d = json.loads(dic_bytes)
12         print(rel_d)
13     return render(request,'index.html')
View Code

Ajax传输文件数据:

注意点:

1.Ajax传输文件数据建议使用内置队象formdata:
var formData = new FormData();
因为formDatafeicha非常牛逼,既可以传普通的键值对,也可以传文件
2.添加普通的键值:
  formData.append();

3.传文件,如何获取文件标签所存储的文件对象。固定语法
1.先用jQuery查找到存储文件的input标签
2.将jQuery查找到存储文件的input标签
3.利用原生js对象的方法去点files[0]获取到标签内部存储的文件对象
 formData.append('my_file',$('#d1')[0].files[0]);

注意:ajax发送文件需要指定俩个额外的参数
processData:false,//告诉前端不要处理数据
contentType:false,//不适用任何编码,因为formdata对象自身自带编码 django后端也能够识别formdata对象

前端代码:
 1 <button id="b1">求和</button>
 2 
 3 {#ajax上传文件#}
 4 <input type="file" id="d1">
 5 
 6 
 7 $('#b1').on('click',function () {
 8     // ajax传输文件 建议使用内置对象formdata
 9      var formData = new FormData(); //既可以传普通的键值对,也可以传文件
10      // 添加普通的键值
11      formData.append('username','zy');
12      formData.append('password','123');
13      //传文件,如何获取文件标签所存储的文件对象。固定语法
14      //1.先用jQuery查找到存储文件的input标签
15      //2.将jQuery查找到存储文件的input标签
16      //3.利用原生js对象的方法去点files[0]获取到标签内部存储的文件对象
17      formData.append('my_file',$('#d1')[0].files[0]);
18     $.ajax({
19         url: '', // 控制发给谁,不写就是朝当前地址提交
20         type: 'post', //发送方式是post请求
21         data:formData, // 发送数据
22         // ajax发送文件需要指定俩个额外的参数
23         processData:false,//告诉前端不要处理数据
24         contentType:false,//不适用任何编码,因为formdata对象自身自带编码 django后端也能够识别formdata对象
25         success:function (data) { //data形参是用来接收异步提交的结果的 ,回调函数
26             {#alert(data)#}
27             //将后端计算好的结果,通过DOM操作,渲染到第三个input框中
28             $('#i3').val(data)
29         }
30     })
31 })
View Code

后端代码:

1 def index(request):
2 
3     if request.method == 'POST':
4         print('request.POST',request.POST)
5         print('request.FILES',request.FILES)
6         return HttpResponse('OK')
7          
8     return render(request,'index.html')
View Code

5.序列化组件

from django.core import serializers  # django自带的一个小型的序列化工具
def reg(request):
    user_list = models.User.objects.all()
    # 将所有的数据都组织成一个符合json的一个个的字典
    # user_l = []
    # for user_obj in user_list:
    #     user_l.append(
    #         json.dumps({'username':user_obj.username,
    #          'age':user_obj.age,
    #          'gender':user_obj.get_gender_display()
    #          })
    #     )
    res = serializers.serialize('json',user_list)  #
    return render(request,'index.html',locals())

猜你喜欢

转载自www.cnblogs.com/zahngyu/p/11575571.html