多对多的创建方式与Ajax

模型层补充

MTV与MVC模型

'''
MTV 全称 Models Templates Views  模型模板视图
MVC 全称 Models Views Controller 模型视图控制MTV: Django号称是MTV模型
MVC: 其实django本质也是MVC
拓展: vue框架:MVVM模型
'''

choices参数(数据库字段设计常见)

choices使用

class User(models.Model):username = models.CharField(max_length=32)age = models.IntegerField()"""作用: 针对可以被预测到结果的字段对应的数据, 那么可以为该字段定制choices参数, 取数据的时候就可以通过`对象.get_设置choices的字段_display()`获取到定制的数据.例如:  性别 学历 工作经验 是否结婚 是否生子 客户来源等等. 针对某个可以列举完全的可能性字段我们用choices存储.使用: 1. 为即将创建的字段定制choices参数. 参数是一个二元组的形式 ((), ()). 元组中第一个参数要满足存储字段的约束条件2. 存: 指定对设置了choices的字段存数据数据存得时候没有列举出来的数字也能存. 范围还是按照字段类型决定3. 取: 指定对设置了choices的字段取数据.  方法: 对象.get_设置choices的字段_display()如果取得时候如果没有对应关系 那么字段是什么还是展示什么"""# 性别gender_choices = ((0, '女'),(1, '男'),(2, '其他'),)gender = models.IntegerField(choices=gender_choices)# 成绩score_choices = (('A', '优秀'),('B', '良好'),('C', '及格'),('D', '不合格'),)# 保证字段类型跟列举出来的元祖第一个数据类型一致即可score = models.CharField(choices=score_choices, null=True)user_obj1 = models.User.objects.create(username='jason', age=18, gender=1)
models.User.objects.create(username='egon', age=85, gender=2)
models.User.objects.create(username='tank', age=40, gender=3)
# 存: 存的时候 没有列举出来的数字也能存（范围还是按照字段类型决定）
user_obj4 = models.User.objects.create(username='tony', age=45, gender=4)# 取: 只要是choices参数的字段 如果你想要获取对应信息 固定写法 get_字段名_display()
print(user_obj1.get_gender_display())  # 男
print(user_obj4.get_gender_display())  # 4 (如果没有对应关系 那么字段是什么还是展示什么)

多对多三种创建方式

1. 全自动

'''
优点: 1. 第三张表以及对应的外键关联字段不需要书写.2. 可以使用ORM提供的多对多关系表之间的增删改查清空方法remove,add,set,clear和正反向+双下划线查询
缺点: 可扩展性极差. 无法对ORM自动生成的第三种虚拟中间表进行增添字段的操作     
'''
class Book(models.Model):name = models.CharField(max_length=32)book = models.ManyToManyField(to='Author')class Author(models.Model):name = models.CharField(max_length=32)

2. 纯手动

'''
优点: 可扩展性强: 第三张表完全取决于自己 
缺点: 需要书写的代码量大. 并且ORM提供的多对多关系的增删改查清空方法, 以及正反向+双下划线查询都不支持一律都不能使用.
'''
class Book(models.Model):name = models.CharField(max_length=32)class Author(models.Model):name = models.CharField(max_length=32)class Book2Author(models.Model):book = models.ForeignKey(to='Book')        author = models.ForeignKey(to='Author')

3. 半自动

'''
优点: 既可以对第三张表进行格外增添字段的操作, 又能使用ORM提供的正反向+双下划线查询
缺点: 不能使用ORM提供的多对多表关系增删改清空方法. add, set, remove, clearManyToManyField中参数指定介绍: to: 需要建立多对多外键关系的表. 本来需要指定to_field, 但是默认关联的就是被关联表的主键, 因此不需要指定.through: 建立多对多关系的第三张表through_fields: 指定元组形式注意: 参数的指定有顺序判断顺序指定的本质: 通过第三张表反向查对应建立多对多外键关联的表需要用到的哪个字段 哪个字段就放在前面简化: 谁是建立多对多外键关联的表, 就把对应的关联字段放前面            
'''
class Book(models.Model):name = models.CharField(max_length=32)authors = models.ManyToManyField(to='Author',through='Book2Author',through_fields=('book', 'author'))class Author(models.Model):name = models.CharField(max_length=32)# books = models.ManyToManyField(#     to='Book',#     through='Book2Author',#     through_fields=('author', 'book'))class Book2Author(models.Model):book = models.ForeignKey(to='Book')author = models.ForeignKey(to='Author')

Ajax

Ajax简介

1. 简介

'''
AJAX 全称 Asynchronous JavaScript and XML 异步JavaScript和XML
特点是: 异步提交. 局部刷新
例如: github注册页面动态获取用户名实时的跟后端确认并实时展示的前端(局部刷新)    1. AJAX 不是新的编程语言，而是一种使用现有标准的新方法(比较装饰器)
2. AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程）
3. 注意: Ajax我们只争对jQuery封装之后的版本(原生的复杂并且在实际项目中也一般不用)
补充: 并不只有jQuery能够实现ajax，其他的框架也可以 但是换汤不换药 原理是一样的
'''

2. 前端朝后端发送请求的方式

'''
1. 浏览器地址栏直接输入url回车       GET请求
2. a标签href属性                   GET请求
3. form表单(:submit 和 button)     GET请求/POST请求
4. ajax                           GET请求/POST请求
'''

Ajax常见应用情景

# 需求
'''
1. 页面上有三个input框
2. 在前两个框中输入数字 点击按钮 朝后端发送ajax请求
3. 后端计算出结果 再返回给前端动态展示的到第三个input框中
强调: 整个过程页面不准有刷新,也不能在前端计算
'''

1. 前端: templates下的ab_ajax.html

<body>
<input type="text" id="d1"> +
<input type="text" id="d2"> =
<input type="text" id="d3">
<p><button class="btn btn-success btn-xs">点我</button>
</p><script>$(".btn").click(function () {// 1. 朝后端发送ajax请求$.ajax({// 2.指定朝哪个后端发送ajax请求url: '',       // 不写就是朝当前地址提交// 2.请求方式type: 'post',  // 不指定默认就是get 都是小写// 3.数据data: {'d1': $("#d1").val(), 'd2': $("#d2").val()},// 4.自动将接收到后端的string类型的json格式, 反序列化转换成对象. 如果后端指定使用JsonResponse返回数据. 那么就无需指定.{#dataType: 'json',#}// 5.回调函数:当后端给你返回结果的时候会自动触发 args接受后端的返回结果success: function (args) {// 6. 通过DOM操作动态渲染到第三个input里面$("#d3").val(args);console.log(typeof args);},})})
</script>
</body>

2. 后端: views.py

# 提示: 因为ajax指定的是post提交方式, 我们需要到settings.py中注释掉MIDDLEWARE中的csrf那一行. 如果没有注释前端将会出现如下异常: 
'''
Failed to load resource: the server responded with a status of 403 (Forbidden)加载资源失败:服务器响应状态为403(禁止)
'''def ab_ajax(request):if request.method == "POST":# 1. 使用HttpResponse返回数据. 实现后端计算出结果 再返回给前端动态展示的到第三个input框中'''d1 = request.POST.get('d1')d2 = request.POST.get('d2')sum = int(d1) + int(d2)return HttpResponse(sum)'''# 2. 使用HttpResponse返回数据. 传字典格式需要使用jason序列化. ajax中指定dataType:'json'设置自动反序列化. 如果前端页面手动指定反序列化需要使用JSON.parse. 如果没有指定是string类型, 而不是一个对象.'''import jsonusername = {'username': 'jason', 'password': '123'}return HttpResponse(json.dumps(username))'''# 3. 使用JsonResponse返回数据. 前端无需反序列化. 可以直接拿到数据对象from django.http import JsonResponseusername = {'username': 'jason', 'password': '123'}return JsonResponse(username)return render(request, 'ab_ajax.html')

前后端传输数据的编码格式(contentType)

# 提示: 主要研究post请求数据的编码格式.
'''
get请求数据就是直接放在url?号后面的每个参数之间用&符连接, 如下:url?username=jason&password=123
'''# 可以朝后端发送post请求的方式1 .form表单2. ajax请求# 基于post请求. 前后端传输数据的3种编码格式urlencodedform-datajson# 基于post请求. form表单传输数据的编码格式默认:  默认的数据编码格式是urlencoded数据格式: username=jason&password=123结论: django后端针对符合urlencoded编码格式的数据都会自动帮你解析封装到request.POST中. 如下所示:username=jason&password=123	>>> request.POST!!!注意!!!: 我们这里指的是符合. 如果你指定的是form-data编码格式, 针对普通的键值对还是解析到request.POST中, 而文件将会解析到request.FILES中# 基于post请求. ajax传输数据的编码格式默认:  默认的数据编码格式是urlencoded数据格式: username=jason&password=123结论: django后端针对符合urlencoded编码格式的数据都会自动帮你解析封装到request.POST中. 如下所示:username=jason&age=20	>>> request.POST

Ajax发送json格式数据

# 强调: 前后端传输数据的时候一定要确保编码格式跟数据真正的格式是一致的. 比如: 你的编码格式指定的是json格式. 那么你的data数据必须也要是json格式.
# request对象方法补充: request.is_ajax()  判断当前请求是否是ajax请求 返回布尔值
# 前后提交json格式数据给后端流程:
'''
1. 前端页面ajax中指定参数(注意: 都是基于post请求方式提交数据)1.1 指定数据编码格式: contentType: application/json1.2 对发送给后端的数据进行序列化: data: JSON.stringify({'username': 'egon', 'age': 18})
2. 后端2.1 json格式的数据django后端不会不会做任何的处理. 需要我们手动 通过request.body获取二进制格式的json数据2.2 后端有2种方式将这种格式反解成python数据类型第一种: 先使用decode解码成str类型. 再使用json.loads反序列化成python数据类型
'''# 前端
$('#d1').click(function () {$.ajax({url:'',type:'post',{#data:{'username':'jason','age':25},#}data:JSON.stringify({'username':'jason','age':25}),contentType:'application/json',  // 指定编码格式success:function () {}})
})# 后端
def ab_json(request):
if request.is_ajax():print(request.is_ajax())  # Trueprint(request.POST)       # <QueryDict: {}>print(request.FILES)      # <MultiValueDict: {}>print(request.body)       # b'{"username":"jason","age":25}'# 手动处理json格式数据: 先反序列化, 再解码'''json_bytes = request.bodyjson_str = json_bytes.decode('utf-8')json_dict = json.loads(json_str)print(json_dict, type(json_dict))  # {'username': 'jason', 'age': 25} <class 'dict'>'''# 由loads内部自动处理: json.loads括号内如果传入了一个二进制格式的数据那么内部自动解码再反序列化'''json_bytes = request.bodyjson_dict = json.loads(json_bytes)  # {'username': 'jason', 'age': 25} <class 'dict'>print(json_dict, type(json_dict))  # {'username': 'jason', 'age': 25} <class 'dict'>'''
return render(request, 'ab_json.html')