Question

I’m having difficulty using two django crispy forms simultaneously. I have one form to just enter new data into my app and another form that displays in a bootstrap modal for users to provide feedback. Below, I’ve stripped my template down to the bare bare basics.

I have a Group form:

class Crispy_Group_Form(forms.ModelForm):

    def __init__(self, *args, **kwargs):
        self.helper = FormHelper()
        # self.helper.form_tag = False
        self.helper.form_class = 'form-horizontal'
        self.helper.layout = Layout(
            Fieldset(
                'New Group',
                Field('name', placeholder='Group Name'),
                Field('notes', placeholder='Group Notes', rows='10', css_class='input-xxlarge'),
            ),
            FormActions(
                Submit('save_changes', 'Save changes', css_class="btn-primary"),
                HTML(' | '),
                Submit('cancel', 'Cancel'),
            )
        )
        self.helper.form_id = 'id-Crispy_Group_Form'
        self.helper.form_method = 'post'


        super(Crispy_Group_Form, self).__init__(*args, **kwargs)        

    class Meta:
        model = Group
        exclude = ['slug']

and a Contact form

class Crispy_ContactForm(forms.ModelForm):

    def __init__(self, *args, **kwargs):
        self.helper = FormHelper()
        self.helper.form_class = 'form ajax'
        self.helper.form_action = 'feedback'
        self.helper.form_tag = False
        self.helper.layout = Layout(
            Fieldset(
                'Contact Form',
                Field('topic', placeholder='Topic', css_class='input-medium'),
                Field('subject', placeholder='Subject', css_class='input-xlarge'),
                Field('message', placeholder='Message', rows='5', css_class='input-xlarge'),
                Field('sender', placeholder='Sender', css_class='input-xlarge'),
            ),
        )
        self.helper.form_id = 'id-Crispy_ContactForm'
        self.helper.form_method = 'post'

        super(Crispy_ContactForm, self).__init__(*args, **kwargs)

    class Meta:
        model = Feedback
        exclude = ['creation_date']

My view:

def bootstrap_test(request):

    return render_to_response(
        "bootstrap_test.html", {
            'feedback_form' : Crispy_ContactForm,
            'form' : Crispy_Group_Form,
        },
        context_instance=RequestContext(request))

And my very basic template:

{% load crispy_forms_tags %}

<form action="{% url feedback %}" method="post" id="id-Crispy_ContactForm" class="form">
    {% crispy feedback_form %}
</form>

{% crispy form %}

The feedback_form is displaying twice. As if both forms are the same form. If I delete the feedback_form from the template, then it shows the Group form. If I rearrange the two so {% crispy form %} is above the feedback_from, it displays the two different forms correctly.

I read the documentation, but wasn’t able to find a method that works.

Why is this happening and what do I need to adjust to get this to display correctly?

Answer 1

Ok, I got it. It seems crispy forms overwrites the “form” variable. That’s why this returns the same two forms:

<form action="{% url feedback %}" method="post" id="id-Crispy_ContactForm" class="form">
    {% crispy feedback_form %}
</form>

{% crispy form %}

but this returns two different forms:

{% crispy form %}

<form action="{% url feedback %}" method="post" id="id-Crispy_ContactForm" class="form">
    {% crispy feedback_form %}
</form>

The first example overwrites the variable “form” before the second form call can grab it.

I just wanted to confirm that it wasn’t something I was doing wrong. So I simply reversed the order the two forms get called so that the instance of {% crispy form %} appears first. I couldn’t use a different variable for form because I’m using the create/update_object functions.