В проекте есть страница с формами. Одну из форм необходимо сделать динамической, данный функционал я реализовал с помощью javascript. Добавление данной формы по скрипту происходит корректно, но добавляемая форам не сохраняет данные в бд.
Для реализации динамической формы я использовал данную статью:
https://www.brennantymrak.com/articles/django-dyna...
Но т.к. у меня на 1 странице в 1 views обрабатывается сразу несколько форм я исправил код под свой проект.
мой forms.py:
class ColorForms(ModelForm):
class Meta:
model = Color
fields = ['temp', 'correct', 'top', 'bottom']
widgets = {
'temp': NumberInput(attrs={
'class': 'form-control',
'placeholder': 'temp'
}),
'correct': NullBooleanSelect(attrs={
'class': 'form-control',
'placeholder': 'correct'
}),
'top': NumberInput(attrs={
'class': 'form-control',
'placeholder': 'top'
}),
'bottom': NumberInput(attrs={
'class': 'form-control',
'placeholder': 'bottom'
}),
}
class SpeedsForms(ModelForm):
class Meta:
model = Speed
fields = ['start', 'end']
widgets = {
"start": TimeInput(attrs={
'class': 'form-control',
'placeholder': "start"
}),
"end": TimeInput(attrs={
'class': 'form-control',
'placeholder': "end"
})
}
DogFormSet = modelformset_factory(
Dog, fields=('name', 'number', 'Speed', 'DataTime'), extra=1
)
class DogRequestsForm(ModelForm):
class Meta:
model = DogRequest
fields = ['id_name', 'Color', 'Dog']
widgets = {
'id_name': NumberInput(attrs={
'class': 'form-control',
'placeholder': 'id_name'
}),
'Color': SelectMultiple(attrs={
'class': 'form-control',
'placeholder': 'Color'
}),
'Dog': SelectMultiple(attrs={
'class': 'form-control',
'placeholder': 'Dog'
}),
}
мой views.py:
from .forms import DogFormSet
def dog(request):
formset = DogFormSet (queryset=dog.objects.none())
if request.method == 'POST' and 'speed' in request.POST:
form2 = SpeedsForms(request.POST)
if form2.is_valid():
form2.save()
if request.method == 'POST' and 'dogs' in request.POST:
formset = DogFormSet(request.POST)
if formset.is_valid():
formset.save()
if request.method == 'POST' and 'color' in request.POST:
form4 = ColorForms(request.POST)
if form4.is_valid():
form4.save()
if request.method == 'POST' and 'Req' in request.POST:
form5 = DogRequestsForm(request.POST)
if form5.is_valid():
form5.save()
form2 = SpeedsForms()
form4 = ColorForms()
form5 = DogRequestsForm()
data = {
'form2': form2,
'formset': formset,
'form4': form4,
'form5': form5,
}
return render(request, 'main/dogsform.html', data)
мой html с скриптом дублирования:
{% block content %}
<div class="features">
<form method="post">
{% csrf_token %}<br>
{{ form4.as_p }}<br>
<button class="btn btn-success" type="submit" name="color">Сохранить</button>
</form>
<form method="post">
{% csrf_token %}<br>
{{ form2.as_p }}
<button class="btn btn-success" type="submit" name="speed">Сохранить</button>
</form>
<form id="form-container" method="post">
{% csrf_token %}<br>
{{DogFormSet.management_form}}
<div class="DogForm">
{{ formset.as_p }}<br>
</div>
<button id="add-form" type="button">Add Another dogs</button>
<button class="btn btn-success" type="submit" name="dogs">Сохранить</button>
</form>
<form method="post">
{% csrf_token %}<br>
{{ form5.as_p }}<br>
<button class="btn btn-success" type="submit" name="Req">Сохранить</button>
</form>
</div>
<script>
let DogForm= document.querySelectorAll(".DogForm")
let container = document.querySelector("#form-container")
let addButton = document.querySelector("#add-form")
let totalForms = document.querySelector("#id_form-TOTAL_FORMS")
let formNum = DogForm.length-1
addButton.addEventListener('click', addForm)
function addForm(e){
e.preventDefault()
let newForm = DogForm[0].cloneNode(true)
let formRegex = RegExp(`form-(\\d){1}-`,'g')
formNum++
newForm.innerHTML = newForm.innerHTML.replace(formRegex, `form-${formNum}-`)
container.insertBefore(newForm, addButton)
totalForms.setAttribute('value', `${formNum+1}`)
}
</script>
{% endblock %}
В статье в html файле форму обрабатывают иначе, но если я сделаю так, как указано в статье форма не отображается. Вариант кода по статье для меня такой:
<form id="form-container" method="POST">
{% csrf_token %}
{{DogFormSet.management_form}}
{% for form in DogFormSet %}
<div class="DogForm">
{{form.as_p}}
</div>
{% endfor %}
<button id="add-form" type="button">Add Another dogs</button>
<button class="btn btn-success" type="submit" name="dogs">Сохранить</button><br>
</form>
Что нужно исправить? Корректный ли у меня views? Почему данные из дубликата формы не сохраняются?
