Collapsible concept explained for a .

A simple collapsible section. The `collapsed` attribute is set by a controller. The 'hide'-button got `immediate="true"` to submitting without validation.

The `collapsedMode="absent"` is set. The 'Submit'-button can be executed without violation if the content of section is hidden.

The state is changed by `<tc:operation/>` with a full server request. The attribute `immediate="true"` is set for the 'hide'-button to change the state without validating the input field.

The `collapsedMode="absent"` is set. The 'Submit'-button can be executed without violation if the content of section is hidden.

In this example opening and closing is done by the client. The attribute `omit="true"` set for the 'show'-button and the 'hide'-button to prevent submitting.

For the section `collapsedMode="hidden"` is set. After the 'hide' transition, the content of the section will be in the 'hidden' state. The hidden content of the section will also be validated.
If the 'Submit'-button is pressed while the input field is empty, a violation occurs.

The show and hide transitions are run with an ajax request. The 'hide'-button got `immediate="true"` to submitting without validation.

The `collapsedMode="absent"` is set. The 'Submit'-button can be executed without violation if the content of section is hidden.

A JavaScript custom event is fired if a `<tc:section/>` is collapsed or expanded.

`tobago.section.show` is fired before the section is expanded.

`tobago.section.shown` is fired after the section is expanded. (Does not wait for a possible Ajax reload.)

`tobago.section.hide` is fired before the section is collaped.

`tobago.section.hidden` is fired after the section is collapsed. (Does not wait for a possible Ajax reload.)