django动态表格总结
应用场景: A与B之间存在一对多关系.
CBV实现方案:
CreateView/UpdateView + inlineformset + jquery
具体:
view方面:重写post/get方法, 或者 get_context_data/form_valid方法。
template方面:注意利用can_delete属性,{{form.DELETE}},将已存在的记录打上true标记,则在保存时自动删除相应记录。
jquery:注意元素的准确定位。这里罗嗦下:判断一行是否是已经存在的行还是新增加的(尚未保存到db)的行的方法是判断{{form.id}}生成的隐藏域的value是否为""或者undefined,如果是,则为新增的行,可以用jq将此行remove掉,同时不要忘了更新所有的控件的id以及行数保存的隐藏域的值。
$.each(function(index, each_obj){}). (index在重新排定id时比较有用)
$.parent() (取得直接父元素)
$.parents() (取得所有父元素)
$.children() (取得所有子元素)
$.children().children() (此用法暂时还没明了过来)
通配符: $("[attr *= bbb]") ,$("[attr ^= bbb]") ,$("[attr $= bbb]") 分别是contains,start_with,end_with逻辑。
inlineformset的html操作的核心在于:
1) 行数(在隐藏域)
2) DELETE标志/id,在修改的时候是必需的
3) 至少要extra=1,多出一行的处理(hide/show),且此行作为模板行,隐藏起来。
4) 多种记录存在一个formset里面的处理(新增的记录,修改的记录,删除的记录),其中修改的记录和新增的处理比较简单--基本不用特别处理; 删除的情况有点复杂,删除原有的记录,还是删除新增加的记录,这个要人工判断,根据id隐藏域是否有value值,再相应的给delete标志位打标志。
简单示例可以查看这里:https://github.com/TommyU/dynamic_form
django动态表格总结的更多相关文章
- 在<s:iterator>标签里给动态表格添加序号
在<s:iterator>标签里给动态表格添加序号,需要用到<s:iterator>标签里的Status属性里的count eg:<s:iterator value=&q ...
- HTML5&CSS3经典动态表格
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- django 动态更新属性值
django 动态更新属性值 class TestTime(models.Model): """ 功能说明:指定测试的每一关总用时 """ ...
- 5.11-5.15javascript制作动态表格
制作动态表格的主要是运用js中表格类的insertRow.insertCell简易添加行和列的代码,不过要注意每行添加的表格是有位置行编号的,每行的编号为rows.length-1,增加的表格内的标签 ...
- Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成)
Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成) 动态表单生成 ElementUI官网引导 Element表单生成 Element动态增减表单,在线代码 关键配置 templa ...
- jQuery的下面是动态表格动态表单中的HTML代码
动态表格动态表单中的Jquery代码 <script type="text/javascript" src="/include/jquery/jquery-1.1. ...
- JavaScript 创建动态表格
JavaScript 创建动态表格 版权声明:未经授权,严禁转载! 案例代码 <div id="data"></div> <script> va ...
- Java利用poi生成word(包含插入图片,动态表格,行合并)
转(小改): Java利用poi生成word(包含插入图片,动态表格,行合并) 2018年12月20日 09:06:51 wjw_11093010 阅读数:70 Java利用poi生成word(包含插 ...
- jQuery动态表格插件 AppendGrid
AppendGrid是一个jQuery动态表格插件,提供像填写电子表格数据一样在页面去输入结构化数据. 它允许用户在表格里增加/删除/插入/删除行,控制input/select/textarea 提交 ...
随机推荐
- 理解C#泛型
在C# 2.0中引入了泛型,泛型的出现解决了编码中的很多问题.相信大家一定经常用到"System.Collections.Generic"命名空间中的泛型集合类("Gen ...
- 第三章:Javascript类型、值和变量。
计算机程序的运行需要对值(value)比如数字3.14或者文本"hello world"进行操作,在编程语言中,能够表示并操作的值的类型叫做数据类型(type),编程语言最基本的特 ...
- Moqui学习Day4
添加一个新建表单 添加一个按钮来弹出新建表单,并创建一个转换来处理输入数据操作. 在FindTutorial.xml文件中添加一个转换. <!--新增 列表 --> <transit ...
- Sublime Text 3 破解版 + 注册机 + 汉化包 + 教程
SublimeText 是一个代码编辑器,也是HTML和散文先进的文本编辑器. SublimeText 是由程序员 Jon Skinner 于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展 ...
- HTTP协议强化理解
一:第一波 1. 是什么? 答:是一种定义超文本在网络中如何进行传输的协议! 所有的WWW上的文件都必须遵循! 是基于TCP/IP. 传输路径: 客户端<——>服务端 (全双工) ...
- OC基础--self关键字&super关键字
PS:OC中的self关键字可以与C#中的this关键字区分记忆,虽然区别还是很大的. OC中的super关键字指的是父类指针 一.self关键字必须了解的知识: 1.使用场合:只能用在方法中(对象方 ...
- Java基础-转义字符
Java中的字符占两个字节.一些常用的转义字符: ①\r表示接受键盘输入,相当于按下了回车键: ②\n表示换行: ③\t表示制表符,相当于Table键: ④\b表示退格键,相当于Back Space键 ...
- Oracle中的伪列
分页查询中,需要用到伪列rownum,代码如下: select * from (select rownum rn, name from cost where rownum <= 6) where ...
- ElasticSearch插件安装Head、Kopf与Bigdesk
ElasticSearch-Head ElasticSearch-Head 是一个与Elastic集群(Cluster)相交互的Web前台. ES-Head的主要作用 它展现ES集群的拓扑结构,并且可 ...
- POJ2594 Treasure Exploration
Time Limit: 6000MS Memory Limit: 65536K Total Submissions: 8193 Accepted: 3358 Description Have ...