Submitting 2 custom Crispy Forms with 1 button Django

Question

I have 2 forms with the second form referencing the first form. I can get the forms to execute correctly using crispy forms, however, when I customize each form using helper = FormHelper() they will no longer submit together. Essentially one form is submitted and the other form thinks it is missing all of its input data.

Forms.py

    from django.forms import ModelForm, forms
from .models import Item, Item_dimensions
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, Submit, Row, Column


# Create the form class.
class List_Item_Form(ModelForm):
    class Meta:
        model = Item
        exclude = ('id','creator','created_on','updated_on' )

    helper = FormHelper()
    helper.layout = Layout(
        Row(
            Column('item_name', css_class='form-group col-md-6 mb-0'),
            Column('price', css_class='form-group col-md-6 mb-0'),
            css_class='form-row'
        ),
        'short_description',
        'description',
        Row(
            Column('main_image', css_class='form-group col-md-2.5 mb-0'),
            Column('image_2', css_class='form-group col-md-2.5 mb-0'),
            Column('image_3', css_class='form-group col-md-2.5 mb-0'),
            Column('image_4', css_class='form-group col-md-2.5 mb-0'),
            Column('image_5', css_class='form-group col-md-2.5 mb-0'),
            css_class='form-row'
        ),
        'quantity'
    )
    helper.add_input(Submit('submit', 'Submit', css_class='btn-primary'))
    helper.form_method = 'POST'

class List_Item_Dimensions(ModelForm):
    class Meta:
        model = Item_dimensions
        exclude = ('id','item_id')
    helper = FormHelper()
    helper.layout = Layout(
            Row(
                Column('x_dim_mm', css_class='form-group col-md-4 mb-0'),
                Column('y_dim_mm', css_class='form-group col-md-4 mb-0'),
                Column('z_dim_mm', css_class='form-group col-md-4 mb-0'),
                css_class='form-row'
            ),
            'weight_grams',
            Submit('submit', 'add_listing')
        )
    helper.add_input(Submit('submit', 'Submit', css_class='btn-primary'))
    helper.form_method = 'POST'

I have tried removing

helper.add_input(Submit('submit', 'Submit', css_class='btn-primary'))

and using just one submit button but it didn't work

Views.py

@login_required
def AddListing(request):
    if request.method == 'POST':
        form = List_Item_Form(request.POST,request.FILES)
        dim_form = List_Item_Dimensions(request.POST)
        if form.is_valid() and dim_form.is_valid():
            itemName = form.cleaned_data['item_name']
            price = form.cleaned_data['price']
            s_desc = form.cleaned_data['short_description']
            desc = form.cleaned_data['description']
            quantity = form.cleaned_data['quantity']
            main_img = form.cleaned_data['main_image']
            image_2 = form.cleaned_data['image_2']
            image_3 = form.cleaned_data['image_3']
            image_4 = form.cleaned_data['image_4']
            image_5 = form.cleaned_data['image_5']
            x_dim = dim_form.cleaned_data['x_dim_mm']
            y_dim = dim_form.cleaned_data['y_dim_mm']
            z_dim = dim_form.cleaned_data['z_dim_mm']
            weight = dim_form.cleaned_data['weight_grams']
            current_user =  request.user
            

            model_instance = Item(creator=current_user, item_name=itemName, 
                                price=price,short_description=s_desc,
                                description=desc, quantity=quantity,
                                main_image=main_img, image_2=image_2, 
                                image_3=image_3, image_4 = image_4, 
                                image_5=image_5)
            dim_instance = Item_dimensions(x_dim_mm = x_dim,
                                            y_dim_mm =y_dim,
                                            z_dim_mm =z_dim, 
                                            weight_grams = weight)
            model_instance.save()
            # dim_instance.save(commit=False)
            dim_instance.item_id = model_instance
            dim_instance.save()
            return HttpResponseRedirect('/user_profile/items/')
    else:
        form = List_Item_Form()
        dim_form = List_Item_Dimensions()
    return render(request, 'store/add_listing.html', {'form': form,'dim_form':dim_form})

template.html

{% block content %}
<div>
    <h1> list a new item </h1>
{% load crispy_forms_tags %} 
{% csrf_token %}
<form method="post", enctype="multipart/form-data">{% csrf_token %}
    {% crispy form  %}
    {% crispy dim_form %}
    {% comment %} {{ form|crispy }}
    {{ dim_form|crispy }} {% endcomment %}
    <input name="submit" type="post" value="template button">
</form>
</div>

{% endblock content %}

Answer 1

{% crispy form %} automatically adds <form></form> tags unless otherwise you specify form_tag = False . See https://django-crispy-forms.readthedocs.io/en/latest/form_helper.html

Here you've already given an outer tag and hence the crispy tags inside it will create nested forms. This makes your HTML invalid. Check https://django-crispy-forms.readthedocs.io/en/latest/crispy_tag_forms.html#crispy-tag-forms

PS: (Haven't used django recently) - don't you need to include the helper and other customisations inside the constructor?