欢迎光临散文网 会员登陆 & 注册

使用“django-dynamic-formset”插件实现动态表单集

2023-03-21 18:40 作者:HangzhouLoser  | 我要投稿

零、说明

Django的表单集是非常强力的功能之一,但需要借助前端的技术实现表单集内的表单动态增加与删除。一个非常简便的方式就是通过django-dynamic-formset”插件快速构建动态的表单集。

在这个案例中,通过modelform与inlineformset实现快速录入部门与员工信息。一个部门有多个员工,因此在录入部门的同时,可以录入该部门的多个员工信息。

最终效果:

动态增加或删除表单集里的表单


一、设置-settings.py

在pycharm中建立django项目与app。

pycharm中建立项目

二、模型层-models.py

三、模型层-forms.py

四、视图层-views.py

五、模板层-index.html

打开django-dynamic-formset的页面“https://github.com/elo80ka/django-dynamic-formset/blob/master/src/jquery.formset.js”,将js文件的所有内容复制。

在static目录下新建js文件夹,在js目录下新建formset.js文件

新建formset.js文件

并将刚刚复制的“jquery.formset.js”文件内容粘贴到新建的js文件中

注意,我没有直接下载引用是因为下载了文件引用会出问题,所以这么复制粘贴的。

将jquery和formset两个js文件全部导入到index.html中。

六、路由层-urls.py

七、其他-__init__.py

八、其他-formset.js

前往别忘了修改formset.js里的prefix!


使用“django-dynamic-formset”插件实现动态表单集的评论 (共 条)

分享到微博请遵守国家法律