我有三种形式,具体取决于我想要添加或删除新字段“成人”和“儿童”的房间数量。例如:如果字段“room”的值为2,则应为每个房间的“成人”和“子”生成两对另一个字段,但如果从2开始更改值,则应删除一对字段。当'room'字段的值从2更改为3时,它应该添加几个字段。
我的forms.py:
class HotelForm(forms.Form):
rooms = forms.IntegerField(label=(u'Rooms'), min_value=1)
class TouristsForm(forms.Form):
adult = forms.IntegerField(label=(u'Adults'), min_value=1, initial=1)
children = forms.IntegerField(label=(u'Children'), min_value=0, initial=0, required=False)
class ChildrenAgeForm(forms.Form):
children_age = forms.IntegerField(label=(u'Children age'), min_value=2, max_value=10, initial=2, required=False
这就是我在views.py中实现formset和验证的方法:
class BookingForm(View):
template_name = 'booking/booking.html'
def get(self, request, *args, **kwargs):
TouristsFormSet = formset_factory(TouristsForm, extra = 1, max_num = 15)
ChildrenAgeFormSet = formset_factory(ChildrenAgeForm, extra = 1, max_num = 20)
booking_form = HotelForm(prefix='booking_form')
tourists_formset = TouristsFormSet(prefix='tourists')
childrenage_formset = ChildrenAgeFormSet(prefix='childrenage')
return render(request, self.template_name, { 'booking_form' : booking_form, 'tourists_formset' : tourists_formset, 'childrenage_formset' : childrenage_formset })
def post(self, request, *args, **kwargs):
TouristsFormSet = formset_factory(TouristsForm, extra = 1, max_num = 15)
ChildrenAgeFormSet = formset_factory(ChildrenAgeForm, extra = 1, max_num = 20)
booking_form = HotelForm(request.POST, prefix='booking_form')
tourists_formset = TouristsFormSet(request.POST, prefix='tourists')
childrenage_formset = ChildrenAgeFormSet(request.POST, prefix='childrenage')
if booking_form.is_valid() and tourists_formset.is_valid() and childrenage_formset.is_valid():
我使用java-script在表单中添加新的formset字段:
$(function(){
$('#id_booking_form-rooms').on('change', function(e){
var n = $('#id_booking_form-rooms').val() || 0;
var html = "";
for (var i = 0; i < n; i++) {
html += "<div>People in the room " + (i + 1) + "</div>"
+ "<br/><label for='id_tourists-" + i + "-adult'>Adults:</label>"
+ "<input id='id_tourists-" + i + "-adult' type='number' name='tourists-" + i + "-adult'/>"
+ "<label for='id_tourists-" + i + "-children'>Children:</label>"
+ "<input id='id_tourists-" + i + "-children' type='number' name='tourists-" + i + "-children' class='children_age'/>"
+ "<div class='extrafieldWrapperChAge'></div>";
}
$(".extrafieldWrapper").html(html);
});
$(".extrafieldWrapper").on('change', '.children_age', function(e){
var n = $(this).val() || 0;
var html = "";
for (var i = 0; i < n; i++) {
html += "<br/><label for='id_childrenage-" + i + "-children_age'>Children age "+(i+1)+"</label>"
+ "<input id='id_childrenage-" + i + "-children_age' type='number' name='childrenage-" + i + "children_age' />";
}
$(this).next('.extrafieldWrapperChAge').html(html);
});
});
看起来像我的模板:
<div class="row">
<div class="fieldWrapper">
{% if booking_form.rooms.errors %}
<ol style="list-style-type:square" >
{% for error in booking_form.rooms.errors %}
<li><strong>This field required</strong></li>
{% endfor %}
</ol>
{% endif %}
{{ booking_form.rooms.label_tag }}
{{ booking_form.rooms }}
</div>
<div class="extrafieldWrapper">
{{ tourists_formset.management_form }}
{{ childrenage_formset.management_form }}
</div>
</div>
在浏览器中看起来像我的表单:
<div class="fieldWrapper">
<label for="id_booking_form-rooms">Rooms:</label>
<input id="id_booking_form-rooms" type="number" name="booking_form-rooms" min="1">
</div>
<div class="extrafieldWrapper">
<div>People in the room 1</div>
<br>
<label for="id_tourists-0-adult">Adults:</label>
<input id="id_tourists-0-adult" type="number" name="tourists-0-adult">
<label for="id_tourists-0-children">Children:</label>
<input id="id_tourists-0-children" class="children_age" type="number" name="tourists-0-children">
<div class="extrafieldWrapperChAge">
<br>
<label for="id_childrenage-0-children_age">Children age 1</label>
<input id="id_childrenage-0-children_age" type="number" name="childrenage-0children_age">
</div>
</div>
但是当我按下提交按钮时,我总是得到[u'ManagementForm data is missing or has been tampered with']
。我错了什么?谢谢你的帮助
答案 0 :(得分:1)
当您在客户端更改formset中的表单数量时,应更改ManagementForm
hidden fields:form-TOTAL_FORMS
,form-INITIAL_FORMS
和form-MAX_NUM_FORMS