day64 crm(4) stark组件的增删改 以及 model_from使用和from组件回顾
SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。
前情提要:Django stark 组件开发的 增删改,
model_form组件的使用
form组件的回顾
一:list_display_link 创建
功能描述:
使包含的字段能用进行跳转(编辑界面)
1:在strak组件中设置对应的接口
2:在注册表中填写注册的内容
注意该内容要对应自制列中的属性元素,即model的属性名
3:在stark中给model普通属性附加a标签
4:效果图 ,即实现了反向解析,又实现了编辑功能
二:form 组件回顾
1: form 表单的功能
2: form 表单的参数
3:form 表单的一对多,以及多对多
3>1
3>2
多对多样式显示
4 :form 表单样式的调用
5:钩子函数
6:钩子函数的调用
三:modelform组件的学习
modelform 可以 减少字段的使用
功能!: 将model 转化成form
model ------>form 不用亲自写form
原来需要自己动手写form 模型类
现在不需要自己动手即可完成
1:modelform 组件
是form 组件的进阶版本,可以更加高效的实现form组件功能
在此之上,还增加了数据渲染功能,至此大大减少了代码的使用量
2:modelform组件的增加界面
views 视图
路由层
前端代码
前端效果
3:modelform 组件 的修改
3>1
get请求获取内容
视图
路由
前端代码
效果
3>2: post请求部分\
注意添加还是更新取决于后面是否有instance=对象这个属性,有就是更新
四:modelform 在stark组件的应用
1:创建modelform对象()供后面的内容使用
创建:接口,供子类进行修改
子类重写
重写model_for_calss
重写类似如下:
1>1:首先导包
from django.forms import ModelForm # 导入包
导入modelform ,创建方法get_model_form
创建modelform 继承modelform 类,创建Meta 类(固定写法),供调用,
model =self.model 传入当前操作的表对象, 默认的获取全部
返回默认的类,如果有自定制的类则使用自定制类
2:写add_view视图函数
2>1:编写add_view方法,
get请求:
获取当前操作的表对象modelform类,
实例化modelform 获取渲染内容
POST请求:
modelform 实例接收请求内容
判断内容是否符合要求
然后save() 实例对象,会自动把内容加到数据库中
否则,返回add界面
视图层:
前端代码:
include代码
<div class="container"> <div class="row"> <div class="col-md-6"> <form action="" method="post" novalidate> {% csrf_token %} {% for field in form_obj %} <div class="form-group"> <label for="">{{ field.label }}</label> {{ field }} <span class="error pull-right">{{ field.errors.0 }}</span> </div> {% endfor %} <button class="btn btn-default">submit</button> </form> </div> </div> </div>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <style> input,select{ display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; } .error{ color: red; } </style> </head> <body> {% include "stark/form.html" %} </body> </html>
前端界面
3: 更改界面
3>1 :
知识点:
modelform 实例对象通过传入当前操作的实例对象进行渲染该对象的内容
注意修改时要用instance=modelform的对象,可以进行渲染
前端代码:
与add继承相同
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <style> input,select{ display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; } .error{ color: red; } </style> </head> <body> {% include "stark/form.html" %} </body> </html>
前端效果
实现反向解析
4:删除数据
也是通过反向解析获取id,
直接通过pk主键删除对象,然后跳转展示界面
前端代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> </head> <body> <form action="" method="post"> {% csrf_token %} <a href="{{list_url}}" class="btn btn-warning">取消</a> <input type="submit" class="btn btn-danger" value="确认删除"> </form> </body> </html>
前端效果:
反向解析
- show_index/
五:分页组件的应用
全局对象
.conut 显示对象个数
numpage. 显示每页多少个
page_range 显示 页数范围
分页对象
has_next() 是否有上一页
has_previous 是否有下一页
next_page_number 转到下一页
previous_page_number 转到上一页
前端代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> </head> <body> <ul> {% for foo in page %} <li>{{foo}}</li> {% endfor %} </ul> <nav aria-label="Page navigation"> <ul class="pagination"> {% if page.has_previous%} <li> <a href="?page={{ page.previous_page_number }}" aria-label="Next"> <span aria-hidden="true">上一页</span> </a> </li> {% else %} <li class="disabled"> <a href="#" aria-label="Next"> <span aria-hidden="true">上一页</span> </a> </li> {% endif %} {% for num in paginator.page_range %} {% if current_page == num %} <li class="active"><a href="?page={{ num }}">{{ num }}</a></li> {% else %} <li><a href="?page={{ num }}">{{ num }}</a></li> {% endif %} {% endfor %} {% if page.has_next %} <li> <a href="?page={{ page.next_page_number }}" aria-label="Next"> {# a标签当前界面拼接#} <span aria-hidden="true">下一页</span> </a> </li> {% else %} <li class="disabled"> <a href="#" aria-label="Next"> <span aria-hidden="true">下一页</span> </a> </li> {% endif %} </ul> </nav> </body> </html>View Code
前端效果
