Django добавление элемента в динамическую форму
Есть ли способ добавить элемент изображения для каждого ввода в форме?
Мне нужно иметь изображение рядом с каждым вводом из формы. Я создал этот образец формы и модели, который работает так же, как и в моем коде. Результат, который я хотел бы получить: this.
Код образца формы
class CreateProfileForm(forms.ModelForm):
fieldsets = [
("Fieldset 1", {'fields': [
'first_name', 'last_name'
]}),
("Fieldset 2", {'fields': [
'address', 'phone'
]}),
]
class Meta:
model = Profile
fields = '__all__'
Код примерной модели
class Profile(models.Model):
# FIELDSET 1
first_name = models.CharField(max_length=50, verbose_name="First name")
last_name = models.CharField(max_length=50, verbose_name="Last name")
# FIELDSET 2
address = models.CharField(max_length=50, verbose_name="Address")
last_name = models.EmailField(verbose_name="Email")
Вид
def create_profile(request):
form = CreateProfileForm()
return render(request, 'form.html', {'form': form})
Шаблон с формой
{% load forms_fieldset static %}
<div class="form data-form">
<form>
{{ form|fieldset:'#000080' }}
<div class="form-group">
<button name="upload" type="submit">Create</button>
</div>
</form>
</div>
Чтобы добавить элемент изображения для каждого ввода в форме, вы можете использовать метод as_table для формы в вашем шаблоне, чтобы отобразить поля формы в виде HTML-таблицы. Каждый ввод будет отображаться как строка таблицы, и вы можете добавить элемент img к каждой строке для отображения изображения.
Вот пример того, как это можно сделать в вашем шаблоне:
<div class="form data-form">
<form>
{% for fieldset in form.fieldsets %}
<fieldset style="border-color: #000080;">
<legend style="color: #000080;">{{ fieldset.legend }}</legend>
<table>
{% for field in fieldset %}
<tr>
<td><img src="{{ field.image_url }}" alt="{{ field.label }}" /></td>
<td>{{ field }}</td>
<td>{{ field.help_text }}</td>
</tr>
{% endfor %}
</table>
</fieldset>
{% endfor %}
<div class="form-group">
<button name="upload" type="submit">Create</button>
</div>
</form>
</div>
В приведенном выше коде я использовал метод as_table на форме, чтобы отобразить поля формы в виде HTML-таблицы.