Form
View OriginalA composable form layout with sections, collapsible areas, flip-card read/edit panels, and built-in Goshtoso field rendering. Supports HTMX validation and external submit triggers.
Goshtoso Component
Go + TemplComplete Form (built-in field types)
Field Validation States
Validation Examples
External Submit (Modal Pattern)
The form has no footer. The submit button uses form="external-form" to trigger submission from outside.
Usage Example
// Built-in field types — set Input, Combobox, Textarea, Toggle, etc. directly
@form.FieldGroup(form.FieldGroupConfig{
ID: "name", Label: "Name", Required: true,
Input: &textinput.Config{ID: "name", Name: "name"},
})
@form.FieldGroup(form.FieldGroupConfig{
ID: "provider", Label: "Provider",
Combobox: &gocombobox.Config{ID: "provider", Name: "provider", Options: opts},
})
// Custom component — use { children... } for anything not built-in
@form.FieldGroup(form.FieldGroupConfig{ID: "tags", Label: "Tags"}) {
@myCustomTagsInput(tags) // any templ.Component
}
// Flip Section — read-only front, editable back
@form.FlipSection(form.FlipSectionConfig{
SectionConfig: form.SectionConfig{Title: "Network"},
}, networkReadView()) {
@form.FieldGroup(form.FieldGroupConfig{
Label: "Pod CIDR",
Input: &textinput.Config{ID: "pod-cidr", Name: "pod_cidr", Value: "10.244.0.0/16"},
})
}
// External submit (modal pattern — no footer, button uses form="..." attribute)
@form.Form(form.Config{ID: "modal-form", HTMX: &form.HTMXConfig{Post: "/api", Swap: "none"}}) { ... }
<button type="submit" form="modal-form">Submit</button>