UNPKG

2.02 kBMarkdownView Raw
1# va-dropdown-form-section
2
3The following examples exercise the various inputs:
4- `startOpen` is a boolean representing whether this section should be rendered as expanded when first loaded.
5- `parentForm` is a `FormGroup` that represents the overall form the section will be attached to. The va-dropdown-form-section will create its own FormGroup elements and attach them to the parentForm.
6- `displayAutoTitle` is a boolean representing whether to use the default title, which is based on the validation state.
7- `titleText` is a string representing the section's name and is displayed in the header.
8- `displayAutoDescription` is a boolean representing whether to use the default description, which is a comma-separated list of the field values.
9- `descriptionText` is a string representing the section's description and is displayed in the header next to the title.
10- `fields` is a collection of `BaseField`s, which are the field controls that will be in the section.
11- `editingHint` is a string that is displayed above all of the fields in the section.
12- `prepopulatedData` is an object that should contain the id of a field for it's key, and then a value for that field's value be to set as. (ex: {ID1: 'John Smith'})
13
14## Example
15
16Create the fields your section will have:
17```javascript
18const fields = [
19 new TextboxField({id: 'ID1', label: 'Label 1', required: true, description: 'Description 1', textboxType: 'text'}),
20 new TextboxField({id: 'ID2', label: 'Label 2', required: true, description: 'Description 2', textboxType: 'text'}),
21 new TextboxField({id: 'ID3', label: 'Label 3', required: true, description: 'Description 3', textboxType: 'text'})
22];
23
24const form = new FormGroup({});
25```
26
27Now you can use it to populate the control:
28```html
29 <va-dropdown-form-section [parentForm]="form" [editingHint]="'This hint will help you'"
30 titleText="Some Name" [fields]="fields"
31 [displayAutoDescription]=true>
32 </va-dropdown-form-section>
33```