Submit button no longer works with django crispy forms

Question

I've added bootstrap to my pages and trying to get django crispy forms to work. Really all I've done is pip install django-crispy-forms, added crispy_forms to INSTALLED_APPS and changed {{ form }} to {% crispy form %} in my template (after adding bootstrap and jquery to my static dir):

{% load crispy_forms_tags %}

{% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}

<form action="." method="post">
{% csrf_token %}
{% crispy form %}
<input type="submit" value="Submit" class="btn btn-success">
</form>

This form used to work just fine. After the change it looks a lot nicer, but the submit button no longer does anything because it gets moved outside the form:

I'm surprised to see the template change affect the layout of the rest of the document. Have I done something wrong or is this a bug?

_{Django 1.8.1, django-crispy-forms 1.4.0}

Answer 1

As you are including the form tags, csrf token and submit button in the template yourself, you should use the crispy filter instead of the crispy tag.

<form action="." method="post">
    {% csrf_token %}
    {{ form|crispy }}
    <input type="submit" value="Submit" class="btn btn-success">
</form>

If you want to use the tag, then you can define your submit button inside a FormHelper. See the crispy tag docs for more info.