View Source Shino.UI.Form (shino v0.1.1-alpha.0)
Provides form related components.
Builds forms in a more semantic way.
Examples
Create a form for collecting post information:
<Form.root
for={@form}
class="mt-8 space-y-6"
phx-change="validate"
phx-submit="save"
>
<Form.field :let={field} field={@form[:title]}>
<Form.label for={field}>Title</Form.label>
<.input field={field} type="text" />
<Form.description>Keep it short and simple.</Form.description>
<Form.error field={field} />
</Form.field>
<Form.field :let={field} field={@form[:body]}>
<Form.label for={field}>Body</Form.label>
<.textarea field={field} />
<Form.description>Please write something meaningful.</Form.description>
<Form.error field={field} />
</Form.field>
<div class="flex justify-end">
<Form.submit phx-disable-with="保存中...">保存</Form.submit>
</div>
</Form.root>
References
Summary
Functions
I don't know how to use it, for now.
Renders a description for a field.
Renders errors for a field.
Renders a wrapper for wrapping parts of a field.
Renders a label for a field.
The root contains all the parts of a form.
Renders a submit button for the form.
Functions
I don't know how to use it, for now.
Attributes
- Global attributes are accepted.
Slots
inner_block
(required)
Renders a description for a field.
Attributes
class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
Renders errors for a field.
Localization
This component accepts a one-arity function as :translate_error
attr.
The argument is {msg, opts}
. You can implement this function with gettext
like this:
def translate_error({msg, opts}) do
if count = opts[:count] do
Gettext.dngettext(DemoWeb.Gettext, "errors", msg, msg, count, opts)
else
Gettext.dgettext(DemoWeb.Gettext, "errors", msg, opts)
end
end
Attributes
field
(Phoenix.HTML.FormField
) (required)class
(:string
) - Defaults tonil
.translate_error
(:any
) - Defaults to&Shino.UI.Form.translate_error/1
.- Global attributes are accepted.
Slots
inner_block
Renders a wrapper for wrapping parts of a field.
Attributes
field
(Phoenix.HTML.FormField
) (required)class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
Renders a label for a field.
Attributes
for
(Phoenix.HTML.FormField
) (required)class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The root contains all the parts of a form.
Attributes
for
(:any
) (required)as
(:any
) - Defaults tonil
.- Global attributes are accepted. Supports all globals plus:
["autocomplete", "name", "rel", "action", "enctype", "method", "novalidate", "target", "multipart"]
.
Slots
inner_block
(required)
Renders a submit button for the form.
Attributes
type
(:string
) - Defaults to"submit"
.- Global attributes are accepted.
Slots
inner_block
(required)