一尘不染

动态将字段添加到表单

django

我的表格中有3个字段。我有一个提交按钮和一个“添加其他字段”按钮。我知道我可以使用__init__表单类中的方法添加字段。

我是Python和Django的新手,并且陷入了一个初学者的问题;我的问题是:

当我单击“添加其他字段”按钮时,添加其他字段的过程是什么?

是否需要再次呈现表单?

我如何以及何时打电话__init__,甚至必须打电话?

如何将参数传递给__init__


阅读 387

收藏
2020-03-26

共1个答案

一尘不染

你的表单必须基于从POST传递给它的一些变量来构造(或盲目检查属性)。每次重新加载视图时(无论是否加载)都会构造表单本身,因此HTML需要包含有关构造正确数量的字段以进行验证的字段数量的信息。

我将以FormSet工作方式看待这个问题:存在一个隐藏字段,其中包含活动表单的数量,每个表单名称前都带有表单索引。

实际上,你可以将一个字段 FormSet

https://docs.djangoproject.com/en/dev/topics/forms/formsets/#formsets

如果你不想使用a FormSet,则可以随时自行创建此行为。

这是从头开始制作的-它应该给你一些想法。它还回答了有关将参数传递给的问题__init__-你只需将参数传递给对象构造函数即可:MyForm('arg1', 'arg2', kwarg1='keyword arg')

Forms

class MyForm(forms.Form):
    original_field = forms.CharField()
    extra_field_count = forms.CharField(widget=forms.HiddenInput())

    def __init__(self, *args, **kwargs):
        extra_fields = kwargs.pop('extra', 0)

        super(MyForm, self).__init__(*args, **kwargs)
        self.fields['extra_field_count'].initial = extra_fields

        for index in range(int(extra_fields)):
            # generate extra fields in the number specified via extra_fields
            self.fields['extra_field_{index}'.format(index=index)] = \
                forms.CharField()

View

def myview(request):
    if request.method == 'POST':
        form = MyForm(request.POST, extra=request.POST.get('extra_field_count'))
        if form.is_valid():
            print "valid!"
    else:
        form = MyForm()
    return render(request, "template", { 'form': form })

HTML

<form>
    <div id="forms">
        {{ form.as_p }}
    </div>
    <button id="add-another">add another</button>
    <input type="submit" />
</form>

JS

<script>
let form_count = Number($("[name=extra_field_count]").val());
// get extra form count so we know what index to use for the next item.

$("#add-another").click(function() {
    form_count ++;

    let element = $('<input type="text"/>');
    element.attr('name', 'extra_field_' + form_count);
    $("#forms").append(element);
    // build element and append it to our forms container

    $("[name=extra_field_count]").val(form_count);
    // increment form count so our view knows to populate 
    // that many fields for validation
})
</script>
2020-03-26