提交按钮不再适用于django crispy表单

时间:2015-05-20 16:10:47

标签: django django-templates django-crispy-forms

我已经在我的网页中添加了引导程序并尝试让django crispy forms正常工作。我所做的一切都是language: android jdk: oraclejdk7 env: global: - ANDROID_BUILD_API_LEVEL=22 - ANDROID_BUILD_TOOLS_VERSION=22.0.1 - ANDROID_ABI=default/x86 - ANDROID_EMULATOR_API_LEVEL=19 android: components: #- platform-tools #- tools - build-tools-$ANDROID_BUILD_TOOLS_VERSION - android-$ANDROID_BUILD_API_LEVEL - android-$ANDROID_EMULATOR_API_LEVEL - addon-google_apis_x86-google-$ANDROID_EMULATOR_API_LEVEL - extra-google-google_play_services - extra-android-support - extra-google-m2repository - extra-android-m2repository - sys-img-x86-android-$ANDROID_EMULATOR_API_LEVEL notifications: email: true before_script: - sudo apt-get update -qq - sudo apt-get install -qq libstdc++6:i386 lib32z1 expect # for gradle output style - export TERM=dumb # environment info - ./gradlew -v - uname -a # emulator - echo no | android create avd --force -n test -t "Google Inc.:Google APIs (x86 System Image):"$ANDROID_EMULATOR_API_LEVEL --abi $ANDROID_ABI - emulator -avd test -no-skin -no-audio -no-window & - android-wait-for-emulator - adb shell input keyevent 82 & # build script: - ./gradlew clean connectedCheck -PdisablePreDex pip install django-crispy-forms添加到crispy_forms并在我的模板中将INSTALLED_APPS更改为{{ form }}(在添加bootstrap和jquery之后)我的静态目录):

{% crispy form %}

此形式过去工作得很好。更改后看起来好多了,但提交按钮不再做任何事情,因为它被移到表单之外

enter image description here

我很惊讶地发现模板更改会影响文档其余部分的布局。我做错了什么或这是一个错误吗?

Django 1.8.1,django-crispy-forms 1.4.0

3 个答案:

答案 0 :(得分:13)

由于您自己在模板中包含表单标记,csrf标记和提交按钮,因此您应该使用crispy filter而不是crispy标记。

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

如果您想使用该标记,则可以在FormHelper内定义提交按钮。有关详细信息,请参阅crispy tag docs

答案 1 :(得分:4)

要在表单中添加提交按钮,crispy_form的文档就是这样做的:

import floppyforms.__future__ as forms # you can use django's own ModelForm here
from crispy_forms.helper import FormHelper
from django.core.urlresolvers import reverse_lazy

class YourForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super(YourForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_method = 'post' # this line sets your form's method to post
        self.helper.form_action = reverse_lazy('your_post_url') # this line sets the form action
        self.helper.layout = Layout( # the order of the items in this layout is important
            'field1_of_your_model',  # field1 will appear first in HTML
            'field2_of_your_model',  # field2 will appear second in HTML
            # this is how to add the submit button to your form and since it is the last item in this tuple, it will be rendered last in the HTML
            Submit('submit', u'Submit', css_class='btn btn-success'), 
    )

    class Meta:
        model = YourModel

然后,在您的模板中,您所要做的就是这个

{% load crispy_forms_tags %}
{% crispy form %}

就是这样。无需在模板中编写任何html。

我认为crispy_forms的重点是在Python中定义HTML。因此,您不必在模板中编写太多HTML。

一些补充说明:

因为你正在使用bootstrap。在上面定义的__init__()内,还有三个对您有帮助的字段,如果您需要,请添加这些字段:

self.helper.form_class = 'form-horizontal' # if you want to have a horizontally layout form
self.helper.label_class = 'col-md-3' # this css class attribute will be added to all of the labels in your form. For instance, the "Username: " label will have 'col-md-3'
self.helper.field_class = 'col-md-9' # this css class attribute will be added to all of the input fields in your form. For isntance, the input text box for "Username" will have 'col-md-9'

答案 2 :(得分:4)

对于其他使用标记卡在这里并想向其<form>添加一些自定义html的人...

您可以将self.helper.form_tag = False属性添加到您的助手中,并且不会在表单末尾附加</form>

更多文档here