primait / pyxis-components / Prima.Pyxis.Form

Configuration


type Form model msg

Represent the Form.


type FormField model msg

Represent the fields admitted by the Form.


type FormFieldset model msg

Represents FormFieldset. This is not a one-to-one representation of an html fieldset tag.

A FormFieldset is made up of a list of list of FormFields. The first list represents the rows of a grid, the latter represents each column of a row.


type Legend msg

Represents the Legend for a FormFieldset.


type RowKind
    = Grid
    | Beside
    | Vertical

Define the flow in which form fields should be displayed. You can choose to use the Pyxis standard (Grid), or to go out of default boundaries with Vertical and Beside.

Configuration Methods

init : Form model msg

Create an instance of a Form. You can specify later which fields will go inside it.

Change Kind to the Form

withBeside : Form model msg -> Form model msg

Create an instance of a Form with standard layout where you have 2 fields in line with 1 label. You can specify later which fields will go inside it.

withVertical : Form model msg -> Form model msg

Create an instance of a Form with vertical layout. You can specify later which fields will go inside it.

Adding Fields to the Form

withFields : FormFieldList model msg -> Form model msg -> Form model msg

Adds a list of field (which represents a row of the Grid) to the Form.

withFieldsAndLegend : Legend msg -> List (FormFieldList model msg) -> Form model msg -> Form model msg

Adds a list of list of field (which represents a list of row of the Grid) to the Form. This list will be wrapped inside a fieldset.

Defining a fieldset with a legend

legend : String -> Legend msg

Creates a Legend for a FormFieldset.

legendWithPrependableHtml : String -> List (Html msg) -> Legend msg

Creates a Legend with prependable Html.

legendWithAppendableHtml : String -> List (Html msg) -> Legend msg

Creates a Legend with appendable Html.

Defining Fields

input : Input model msg -> FormField model msg

Transforms an Input component into a FormField.

inputList : List (Input model msg) -> FormField model msg

Transforms an Input component into a FormField.

autocomplete : (Autocomplete.Msg -> msg) -> Autocomplete.State -> Autocomplete model -> FormField model msg

Transforms an Autocomplete component into a FormField.

checkbox : Checkbox model msg -> FormField model msg

Transforms a Checkbox component into a FormField.

date : Date model msg -> FormField model msg

Transforms a Date component into a FormField.

filterableSelect : (FilterableSelect.Msg -> msg) -> FilterableSelect.State -> FilterableSelect model -> FormField model msg

Transforms an FilterableSelect component into a FormField.

flag : CheckboxFlag.Flag model msg -> FormField model msg

Transforms a Flag component into a FormField.

radio : Radio model msg -> FormField model msg

Transforms a Radio component into a FormField.

radioFlag : RadioFlag model msg -> FormField model msg

Transforms a RadioFlag component into a FormField.

radioButton : RadioButton model msg -> FormField model msg

Transforms a RadioButton component into a FormField.

select : (Select.Msg -> msg) -> Select.State -> Select model -> FormField model msg

Transforms a Select component into a FormField.

textArea : TextArea model msg -> FormField model msg

Transforms a TextArea component into a FormField.

Manipulating Fields

withLabel : Label msg -> FormField model msg -> FormField model msg

Adds a Label component into a FormField.

withAppendableHtml : List (Html msg) -> FormField model msg -> FormField model msg

Adds a list of Html to a FormField. They will be printed after the component tag and it's wrapper.

Rendering

renderField : model -> FormField model msg -> List (Html msg)

Transforms o render a FormField into Html.

renderFields : model -> RowKind -> List (FormFieldList model msg) -> List (Html msg)

Transforms or render a FormField list into Html without fieldset and form div.

renderLabel : FormField model msg -> List (Html msg)

Transforms or render a FormField label into Html.

render : model -> Form model msg -> Html msg

Renders the form with all his fields.