Accordion

class crispy_forms_gds.layout.Accordion(*fields, **kwargs)

A layout object for displaying an Accordion component.

Accordion is the parent object to which you add an AccordionSection for each of the panels you want to display.

Examples:

Accordion(
    AccordionSection("title_1", "form_field_1", "form_field_2"),
    AccordionSection("title_2", "form_field_3")
)

Accordion(
    AccordionSection("title", "form_field_1", "form_field_2"),
    css_id="accordion-1"
)
Parameters

  • css_id (str, optional) – an unique identifier for the accordion. The default is “accordion”. You will need to set this if you have more than one accordion on a page.

  • css_class (str, optional) – the names of one or more CSS classes that will be added to the parent <div>. The basic Design System CSS classes will be added automatically. This parameter is for any extra styling you want to apply.

  • template (str, optional) – the path to a template that overrides the one normally used the accordion.

  • *fields – a list of AccordionSection objects that are the panels that make up this accordion.

  • **kwargs – any additional attributes you want to add to the parent <div>.

AccordionSection

class crispy_forms_gds.layout.AccordionSection(name, *fields, summary=None, **kwargs)

A layout object for displaying a action in an Accordion component.

Examples:

AccordionSection("title", "form_field_1", "form_field_2")

AccordionSection(
    "title",
    "form_field_1",
    summary="A short description of the contents"
)
Parameters

  • name (str) – the title of the section.

  • summary (str, optional) – a short description of the section’s contents.

  • css_id (str, optional) – an unique identifier for the section. This is included as an AccordionSection is just a specialised Div. It is a basic LayoutObject param and should never have to set it.

  • css_class (str, optional) – the names of one or more CSS classes that will be added to the section <div>. The basic Design System CSS classes will be added automatically. This parameter is for any extra styling you want to apply.

  • template (str, optional) – the path to a template that overrides the one used to render a section.

  • *fields – a list of layout objects objects that make up the section contents.

  • **kwargs – any additional attributes you want to add to the section <div>.