Reusable component to build basic forms. Accept text, checkboxes, select and custom components. Layout can be single/two columns per row. It uses bootstrap.
Example
FormBuilder(v-model="formData":sections="sections")
sections: [
{
name: "routing_start_section",
header: false,
collapsable: false,
rows: [
{
columns: [
{
label: "transportType",
//i18n
title: "geocoding.routing.transportType",
type: "select",
value: "car",
options: [{text:"Car", value:"car"}],
},
],
}
}
]Members
# static watch
v-model support write: (value -> object) read: input event with object copy
Methods
# getI18nText()
Fallback 1: Tries to find a locale by title: popup.form_builder.sections.foo Fallback 2: Tries to find a locale by title: foo Fallback 3: Tries to find a locale by label: popup.form_builder.sections.foo Fallback 4: Tries to find a locale by label: foo Fallback 5: Tries to return title if availalble Fallback 6: Tries to return label (label is mandatory)
# goBackForm()
Will reset the form data (this.object) and validation state
# isFormValid()
# onColumnValueChange()
# validForm()
- To Do:
-
- this.object already contains values. Do not store values in form definition (this.sections)
View Source components/shared/Builders/FormBuilder.vue, line 375