Hello all,
I’m seeking advice on how to approach an issue I’m having trying use the Crispy Forms (bootstrap4) {% crispy %} tag to render 2 different forms in the same template. The forms in question are used during user registration (1 for the email and password and the other for additional information like interests, etc.).
The reason I’m using the tag is I have some checkboxes I am trying to render with the InlineCheckboxes layout feature of the FormHelper to style the form more. As these are two forms, they each require a separate add_input, resulting in two submit buttons on the form.
Is there a way to accomplish this using the {% crispy %} tags or should I look at an alternative approach? I looked into Django Formsets, but it seems they only apply if you’re needing multiple of the same form.
If they are two different forms with two different submit buttons (one for each form), then you render them on the page with two separate <form ...> tags.
If you render the form using something like {% crispy my_form %}, and your form helper is defined with form_tag = True, then this is what’s going to happen.
You’ll then need to either design your view to tell which form was submitted to it, or modify the action attribute (perhaps setting the form_action in the helper) on one (or both) of the forms to submit those forms to different views.
Hi Ken,
Thanks for the reply. I should have specified that I would like the form to have a single submit button as I have a single view handling the response.
Then you set the form_tag = False in the helper, and render a <form ...> element yourself surrounding the two forms. (Note: You will almost certainly want to define a prefix for one or both of those forms to ensure no conflict between field names.)
Alright. But if I’m using {% crispy %} tags on a form, doesn’t that form need to have a submit button defined in the FormHelper to allow in to post (a button in the template doesn’t seem to work). Meaning I would end up with 2 submit buttons on the page. Sorry if this is incorrect.
No, that is not correct.
A button in the template will work.
If you were trying it before in a form where form_tag = True, then the issue would most likely have been that the button was being rendered outside the <form ...> element.
In this situation, since you are rendering the <form ...> and </form> elements, you can ensure that the button resides within that element.
Or, if you want to ensure the button is part of the layout, you can include the submit button in only one of the forms. A submit button will submit all fields within the <form> element, regardless of how many Django forms are rendered within that element.
(Don’t lose site of the principle that a Django form is not the same thing as an HTML form - they exist in two different physical locations and have two completely separate sets of properties and behaviors.)
I see. Thank you very much for that Ken. My form is working now. I will do some more reading on Django forms.
Hi Ken.Does this also apply to different templates but one crispy form with one submit button?
Welcome @aysugafarli23 !
I’m sorry, but I’m not sure I’m understanding what you’re asking here. A submit button will submit all active (not disabled) fields within the HTML form element that the button resides in.