В настоящее время я делаю список задач, используя Django набор форм модели. Я столкнулся с проблемой при попытке перечислить каждую форму в наборе с кнопкой удаления рядом с ней. Вот изображение того, как это выглядит сейчас: При ближайшем рассмотрении расстояние и высота для каждой формы немного отличаются от расстояния и высоты для каждой кнопки удаления. Кнопки немного больше и расположены на большем расстоянии, чем формы. Вот мои views.py:
def dashboard(request):
user = request.user
todo_list = Todo.objects.filter(user=user).all()
UpdateFormSet = modelformset_factory(Todo, fields=('item',))
if request.method == 'POST':
formset = UpdateFormSet(request.POST, queryset=todo_list)
if 'delete' in request.POST:
items_to_delete = request.POST.getlist('delete')
deleted_items = Todo.objects.filter(pk__in=items_to_delete).delete()
if 'update' in request.POST:
if formset.is_valid():
instances = formset.save(commit=False)
for instance in instances:
instance.user = user
instance.save()
return redirect('dashboard')
formset = UpdateFormSet(queryset=todo_list)
if not formset:
formset = UpdateFormSet()
context = {
'current_user': request.user,
'formset':formset,
'items':todo_list,
}
return render(request, 'users/dashboard.html', context)
Шаблон:
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<legend class="border-bottom mb-4 pt-3">ToDo Items</legend>
{{ formset.management_form }}
<div class="row">
<div class="col-6">
{% for form in formset reversed %}
{{ form.id }}
<div class="py-3">
{{ form.item }}
</div>
{% endfor %}
</div>
<div class="col-6">
<div class="input-group">
<div class="input-group-append">
<button type="submit" class="btn btn-sm btn-success my-3" name="update"><i class="fas fa-plus"></i>
</button>
</div>
</div>
{% for item in items reversed %}
<div class="input-group">
<div class="input-group-append">
<button type="submit" class="btn btn-sm btn-danger my-3" name="delete" value="{{ item.pk }}">
<i class="far fa-trash-alt"></i>
</button>
</div>
</div>
{% endfor %}
</div>
</div>
</fieldset>
<div class="form-group">
<button class="btn btn-outline-info" type="submit" name="update">Save</button>
</div>
</form>
Я не могу выровнять каждую форму с ее кнопкой удаления. Я предполагаю, что два цикла for мешают этому. Любая помощь будет высоко ценится!