Usage¶
Import crispy-forms-foundation then you can use the layout objects in your form :
from crispy_forms_foundation.layout import Layout, Fieldset, SplitDateTimeField, Row, Column, ButtonHolder, Submit
class YourForm(forms.ModelForm):
def __init__(self, *args, **kwargs):
self.helper = FormHelper()
self.helper.form_action = '.'
self.helper.layout = Layout(
Fieldset(
'Content',
'title',
'content',
),
Fieldset(
'Display settings',
Row(
Column('template', css_class='large-6'),
Column('order', css_class='large-3'),
Column('visible', css_class='large-3'),
),
),
Fieldset(
'Publish settings',
'parent',
Row(
Column(SplitDateTimeField('published'), css_class='large-6'),
Column('slug', css_class='large-6'),
),
),
ButtonHolder(
Submit('submit_and_continue', 'Save and continue'),
Submit('submit', 'Save'),
),
)
super(YourForm, self).__init__(*args, **kwargs)
The embedded templates are in crispy_forms_foundation/templates/foundation-5
.
Use Foundation Abide validation¶
You can use Abide validation in your form but note that there is no support within the layout objects. You will have to add the required
attribute (and eventually its validation pattern) on your field widgets in your form like this:
title = forms.CharField(label=_('Title'), widget=forms.TextInput(attrs={'required':''}), required=True)
To enable Abide on your form, you’ll have to load its Javascript library (if you don’t load yet the whole Foundation library) then in your form helper you will have to add its attribute on the form like this :
class SampleForm(forms.Form):
title = forms.CharField(label=_('Title'), widget=forms.TextInput(attrs={'required':''}), required=True)
textarea_input = forms.CharField(label=_('Textarea'), widget=forms.Textarea(attrs={'required':''}), required=True)
def __init__(self, *args, **kwargs):
self.helper = FormHelper()
# Enable Abide validation on the form
self.helper.attrs = {'data_abide': ''}
self.helper.form_action = '.'
self.helper.layout = Layout(
...
)
super(SampleForm, self).__init__(*args, **kwargs)
You can also set an Abide error message directly on the field like this :
class SampleForm(forms.Form):
def __init__(self, *args, **kwargs):
super(SampleForm, self).__init__(*args, **kwargs)
self.fields['textarea_input'].abide_msg = "This field is required !"
Support within tabs¶
Default Abide behavior is not aware of Tabs and so input errors can be hided when they are not in the active tab.
crispy-forms-foundation ships a jQuery plugin that add support for this usage, you will need to load it in your pages then initialize it on your form:
<script type="text/javascript" src="{{ STATIC_URL }}js/crispy_forms_foundation/plugins.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$('form').abide_support_for_tabs();
});
//]]>
</script>
This way, all input errors will be raised to their tab name that will display an error mark.
Support within accordions¶
Like with tabs, there is a jQuery plugin to add Abide support within accordions.
You will need to load it in your pages then initialize it on your form:
<script type="text/javascript" src="{{ STATIC_URL }}js/crispy_forms_foundation/plugins.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$('form').abide_support_for_accordions();
});
//]]>
</script>
Automatic form layout¶
There is some forms you can use to quickly and automatically create a Foundation layout for your forms. This is mostly for fast integration or prototyping because it will probably never totally fit to your design.
-
class
crispy_forms_foundation.forms.
FoundationForm
(*args, **kwargs)¶ Bases:
crispy_forms_foundation.forms.FoundationFormMixin
,django.forms.forms.Form
A Django form that inherit from
FoundationFormMixin
to automatically build a form layoutExample:
from django import forms from crispy_forms_foundation.forms import FoundationForm class YourForm(FoundationForm): title = "Testing" action = 'test' layout = Layout(Fieldset("Section", "my_field", "my_field_2")) switches = False attrs = {'data_abide': ""} title = forms.CharField(label='Title', required=True) slug = forms.CharField(label='Slug', required=False)
-
class
crispy_forms_foundation.forms.
FoundationFormMixin
¶ Bases:
object
Mixin to implement the layout helper that will automatically build a form layout
Generally, you will prefer to use
FoundationForm
orFoundationModelForm
instead.If you still want to directly use this mixin you’ll just have to execute
FoundationFormMixin.init_helper()
in your form init.Attributes
- title
- If set, defines the form’s title
- layout
- If set, override the default layout for the form
- error_title
- Defines the error title for non field errors
- form_id
- Defines the id of the form
- classes
- Defines the classes used on the form
- action
- Defines the action of the form.
reverse
will be called on the value. On failure the value will be assigned as is - method
- Defines the method used for the action
- attrs
- Defines the attributes of the form
- switches
- If True, will replace all fields checkboxes with switches
- submit
- Adds a submit button on the form. Can be set to a Submit object or a string which will be used as the value of the submit button
- title_templatestring
- Template string used to display form title (if any)
-
class
crispy_forms_foundation.forms.
FoundationModelForm
(*args, **kwargs)¶ Bases:
crispy_forms_foundation.forms.FoundationFormMixin
,django.forms.models.ModelForm
A Django Model form that inherit from
FoundationFormMixin
to automatically build a form layoutExample:
from crispy_forms_foundation.forms import FoundationModelForm class YourForm(FoundationModelForm): title = "Testing" action = 'test' layout = Layout(Fieldset("Section", "my_field", "my_field_2")) switches = False attrs = {'data_abide': ""} class Meta: model = MyModel fields = ['my_field', 'my_field_2', 'my_field_3']