如何在 Django 中创建动态表单集?

发布于 2024-08-23 06:26:25 字数 771 浏览 6 评论 0原文

这是我的做法:

{{ formset.management_form }}
<table>
    {% for form in formset.forms %}
        {{ form }}
    {% endfor %}
</table>
<a href="javascript:void(0)" id="add_form">Add Form</a>   

这是 JS:

var form_count = {{formset.total_form_count}};
$('#add_form').click(function() {
    form_count++;
    var form = '{{formset.empty_form|escapejs}}'.replace(/__prefix__/g, form_count);
    $('#forms').append(form)
    $('#id_form-TOTAL_FORMS').val(form_count);
});

特别困扰我的是我必须自己编写 escapejs 模板标记。它只是删除所有换行符并转义任何单引号,这样就不会弄乱我的字符串。但是 Django 制作者到底希望我们在这种情况下做什么呢?为什么他们有这个 TOTAL_FORMS 隐藏字段,而他们可以只使用 这样的数组,然后进行计数它的长度呢?

Here's the way I'm doing it:

{{ formset.management_form }}
<table>
    {% for form in formset.forms %}
        {{ form }}
    {% endfor %}
</table>
<a href="javascript:void(0)" id="add_form">Add Form</a>   

And here's the JS:

var form_count = {{formset.total_form_count}};
$('#add_form').click(function() {
    form_count++;
    var form = '{{formset.empty_form|escapejs}}'.replace(/__prefix__/g, form_count);
    $('#forms').append(form)
    $('#id_form-TOTAL_FORMS').val(form_count);
});

What specifically bothers me is that I had to write that escapejs template tag myself. It just strips all newlines and escapes any single quotes so that it doesn't mess up my string. But what exactly did the Django makers expect us to do in this situation? And why do they have this TOTAL_FORMS hidden field, when they could have just used an array like <input name="my_form_field[0]" /> and then counted its length instead?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

夜深人未静 2024-08-30 06:26:25

Django 中有几个地方“原因”是因为 Django 管理应用程序是这样实现的,我相信这就是其中之一。因此答案是他们希望你实现你自己的 javascript。

请参阅这个SO问题 动态添加表单...< /a> 了解更多 javascript 想法。

还有两个可插入应用程序可用,django-dynamic-formset 和 < a href="http://github.com/javisantana/django-dinamyc-form" rel="nofollow noreferrer">django-dinamyc-form 直到刚才查找第一个时我才看到一。

There are a few places in Django where "the reason why" is because that's how it was implemented for the Django admin app, and I believe this is one of them. Thus the answer is they expect you to implement your own javascript.

See this SO question Dynamically adding a form... for some more javascript ideas.

There are also two pluggable apps available, django-dynamic-formset and django-dinamyc-form which I hadn't seen until just now when looking up the first one.

固执像三岁 2024-08-30 06:26:25

这个问题有点老了,但我也花了一段时间才弄清楚。

我建议在模板中将 formset.empty_form 渲染为隐藏字段,并在 JavaScript 中引用该字段。

这是 django 管理站点上的一个复杂的动态表单集示例:
(但请注意,它尚未更新为使用empty_form......)

[js]
http://code.djangoproject。 com/browser/django/trunk/django/contrib/admin/media/js/inlines.js

[html 模板]
http://code. djangoproject.com/browser/django/trunk/django/contrib/admin/templates/admin/edit_inline/tabular.html

This question is a bit old, but it took me a while to figure this out as well.

I suggest rendering formset.empty_form in your template as a hidden field, and referencing this field in your javascript.

Here's a complicated dynamic formset example from the django admin site:
(but note that it has not been updated to use empty_form....)

[js]
http://code.djangoproject.com/browser/django/trunk/django/contrib/admin/media/js/inlines.js

[html template]
http://code.djangoproject.com/browser/django/trunk/django/contrib/admin/templates/admin/edit_inline/tabular.html

硬不硬你别怂 2024-08-30 06:26:25

这是因为表单集被创建为无需 JavaScript,仅使用通常的 HTTP 工作流程。

Django 与 JavaScript 无关。

如果你想添加一些 JavaScript,你可以使用 专用 jquery 插件

It's because formset have been created to work without javascript, using only the usual HTTP workflow.

Django is javascript agnostic.

If you want to add some javascript to the mix, you can use the dedicated jquery plugin.

醉南桥 2024-08-30 06:26:25

就我而言。我使用了插件 django-dynamic-formset (https://code.google .com/p/django-dynamic-formset/wiki/Usage

并修改了“添加”选项并且效果良好。

 $('#formset-table tbody tr').formset({
            前缀: '{{ formset.prefix }}',
            formCssClass: '{{ formset.prefix }}-inlineformset',
            添加:函数(obj_tr){ 
                var form = $(obj_tr).html().replace(/\-(\w+)\-(\w+)(fix__)\-/g, '-');
                $(obj_tr).html(form);

           },

这个正则表达式替换字符串 [prefix]-prefix Peer '-'

也许不是最好的解决方案,但有效。

in my case. i used the plugin django-dynamic-formset (https://code.google.com/p/django-dynamic-formset/wiki/Usage)

and modified the option "added" and worked good.

        $('#formset-table tbody tr').formset({
            prefix: '{{ formset.prefix }}',
            formCssClass: '{{ formset.prefix }}-inlineformset',
            added: function(obj_tr){ 
                var form = $(obj_tr).html().replace(/\-(\w+)\-(\w+)(fix__)\-/g, '-');
                $(obj_tr).html(form);

           },

this regular expression replace the string [prefix]-prefix peer '-'

maybe isn't the best solution, but worked.

还不是爱你 2024-08-30 06:26:25

使用 formset.empty_form 作为字符串,将 '__prefix__' 替换为实际的表单集表单索引时,在某些情况下可能会出现 XSS。我的可插入应用程序将 formset.empty_form 转换为 Knockout.js 模板,然后通过自定义 Knockout.js 绑定进行克隆。此外,当在提交带有内联表单集的整个表单之前动态删除新添加的表单集表单时,Knockout.js 会自动重新计算表单字段 id 索引。这是文档:

https://django-jinja-knockout.readthedocs.org/en/latest/forms.html#dynamically-adding-new-lated-formset-forms

Knockout.js 绑定还可以在加载内联自定义字段时防止 XSS JavaScript。

There are some cases of possible XSS when using formset.empty_form as a string, replacing '__prefix__' to actual formset form index. My pluggable application converts formset.empty_form into Knockout.js template which is then cloned via custom Knockout.js bindings. Also Knockout.js automatically re-calculates form field id indexes, when newly added formset form is dynamically deleted before the whole form with inlineformsets was submitted. Here is the documentation:

https://django-jinja-knockout.readthedocs.org/en/latest/forms.html#dynamically-adding-new-related-formset-forms

Knockout.js binding also prevents XSS when loading custom fields with inline Javascript.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文