mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
fix documentation form json
This commit is contained in:
Eugenio Romano
parent
af9873cfce
commit
224dd17042
@ -21,11 +21,6 @@ export class DemoForm {
|
||||
return {
|
||||
'id': 1001,
|
||||
'name': 'ISSUE_FORM',
|
||||
'processDefinitionId': 'ISSUE_APP:1:2504',
|
||||
'processDefinitionName': 'ISSUE_APP',
|
||||
'processDefinitionKey': 'ISSUE_APP',
|
||||
'taskId': '2510',
|
||||
'taskDefinitionKey': 'sid-F67A2996-1684-4774-855A-4591490081FD',
|
||||
'tabs': [],
|
||||
'fields': [
|
||||
{
|
||||
|
||||
329
docs/docassets/demo-form.json
Normal file
329
docs/docassets/demo-form.json
Normal file
@ -0,0 +1,329 @@
|
||||
{
|
||||
'id': 1001,
|
||||
'name': 'ISSUE_FORM',
|
||||
'tabs': [],
|
||||
'fields': [
|
||||
{
|
||||
'fieldType': 'ContainerRepresentation',
|
||||
'id': '1498212398417',
|
||||
'name': 'Label',
|
||||
'type': 'container',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': false,
|
||||
'options': null,
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': null,
|
||||
'className': null,
|
||||
'dateDisplayFormat': null,
|
||||
'sizeX': 2,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'numberOfColumns': 2,
|
||||
'fields': {
|
||||
'1': [
|
||||
{
|
||||
'fieldType': 'RestFieldRepresentation',
|
||||
'id': 'label',
|
||||
'name': 'Label',
|
||||
'type': 'dropdown',
|
||||
'value': 'Choose one...',
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': true,
|
||||
'options': [
|
||||
{
|
||||
'id': 'empty',
|
||||
'name': 'Choose one...'
|
||||
},
|
||||
{
|
||||
'id': 'option_1',
|
||||
'name': 'test1'
|
||||
},
|
||||
{
|
||||
'id': 'option_2',
|
||||
'name': 'test2'
|
||||
},
|
||||
{
|
||||
'id': 'option_3',
|
||||
'name': 'test3'
|
||||
}
|
||||
],
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': null,
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 2
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null,
|
||||
'endpoint': null,
|
||||
'requestHeaders': null
|
||||
},
|
||||
{
|
||||
'fieldType': 'FormFieldRepresentation',
|
||||
'id': 'Date',
|
||||
'name': 'Date',
|
||||
'type': 'date',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': null,
|
||||
'options': null,
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': 'tab1',
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 2
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null
|
||||
},
|
||||
{
|
||||
'fieldType': 'FormFieldRepresentation',
|
||||
'id': 'label5',
|
||||
'name': 'Label5',
|
||||
'type': 'boolean',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': null,
|
||||
'options': null,
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': 'tab1',
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 1
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null
|
||||
},
|
||||
{
|
||||
'fieldType': 'FormFieldRepresentation',
|
||||
'id': 'label6',
|
||||
'name': 'Label6',
|
||||
'type': 'boolean',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': null,
|
||||
'options': null,
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': 'tab1',
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 1
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null
|
||||
},
|
||||
{
|
||||
'fieldType': 'FormFieldRepresentation',
|
||||
'id': 'label4',
|
||||
'name': 'Label4',
|
||||
'type': 'integer',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPattern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': null,
|
||||
'options': null,
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': 'tab1',
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 2
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null
|
||||
},
|
||||
{
|
||||
'fieldType': 'RestFieldRepresentation',
|
||||
'id': 'label12',
|
||||
'name': 'Label12',
|
||||
'type': 'radio-buttons',
|
||||
'value': null,
|
||||
'required': false,
|
||||
'readOnly': false,
|
||||
'overrideId': false,
|
||||
'colspan': 1,
|
||||
'placeholder': null,
|
||||
'minLength': 0,
|
||||
'maxLength': 0,
|
||||
'minValue': null,
|
||||
'maxValue': null,
|
||||
'regexPatt§12212ern': null,
|
||||
'optionType': null,
|
||||
'hasEmptyValue': null,
|
||||
'options': [
|
||||
{
|
||||
'id': 'option_1',
|
||||
'name': 'Option 1'
|
||||
},
|
||||
{
|
||||
'id': 'option_2',
|
||||
'name': 'Option 2'
|
||||
}
|
||||
],
|
||||
'restUrl': null,
|
||||
'restResponsePath': null,
|
||||
'restIdProperty': null,
|
||||
'restLabelProperty': null,
|
||||
'tab': 'tab1',
|
||||
'className': null,
|
||||
'params': {
|
||||
'existingColspan': 1,
|
||||
'maxColspan': 2
|
||||
},
|
||||
'dateDisplayFormat': null,
|
||||
'layout': {
|
||||
'row': -1,
|
||||
'column': -1,
|
||||
'colspan': 1
|
||||
},
|
||||
'sizeX': 1,
|
||||
'sizeY': 1,
|
||||
'row': -1,
|
||||
'col': -1,
|
||||
'visibilityCondition': null,
|
||||
'endpoint': null,
|
||||
'requestHeaders': null
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
'outcomes': [],
|
||||
'javascriptEvents': [],
|
||||
'className': '',
|
||||
'style': '',
|
||||
'customFieldTemplates': {},
|
||||
'metadata': {},
|
||||
'variables': [],
|
||||
'customFieldsValueInfo': {},
|
||||
'gridsterForm': false,
|
||||
'globalDateFormat': 'D-M-YYYY'
|
||||
}
|
||||
@ -240,169 +240,7 @@ also implement your own custom validators to replace or extend the set. See the
|
||||
|
||||
#### Render form by using form definition JSON
|
||||
|
||||
Below is a sample form definition JSON.
|
||||
|
||||
```json
|
||||
{
|
||||
"id": 1001,
|
||||
"name": "ISSUE_FORM",
|
||||
"processDefinitionId": "ISSUE_APP:1:2504",
|
||||
"processDefinitionName": "ISSUE_APP",
|
||||
"processDefinitionKey": "ISSUE_APP",
|
||||
"taskId": "2510",
|
||||
"taskDefinitionKey": "sid-F67A2996-1684-4774-855A-4591490081FD",
|
||||
"tabs": [],
|
||||
"fields": [
|
||||
{
|
||||
"fieldType": "ContainerRepresentation",
|
||||
"id": "1498212398417",
|
||||
"name": "Label",
|
||||
"type": "container",
|
||||
"value": null,
|
||||
"required": false,
|
||||
"readOnly": false,
|
||||
"overrideId": false,
|
||||
"colspan": 1,
|
||||
"placeholder": null,
|
||||
"minLength": 0,
|
||||
"maxLength": 0,
|
||||
"minValue": null,
|
||||
"maxValue": null,
|
||||
"regexPattern": null,
|
||||
"optionType": null,
|
||||
"hasEmptyValue": false,
|
||||
"options": null,
|
||||
"restUrl": null,
|
||||
"restResponsePath": null,
|
||||
"restIdProperty": null,
|
||||
"restLabelProperty": null,
|
||||
"tab": null,
|
||||
"className": null,
|
||||
"dateDisplayFormat": null,
|
||||
"sizeX": 2,
|
||||
"sizeY": 1,
|
||||
"row": -1,
|
||||
"col": -1,
|
||||
"numberOfColumns": 2,
|
||||
"fields": {
|
||||
"1": [
|
||||
{
|
||||
"fieldType": "RestFieldRepresentation",
|
||||
"id": "label",
|
||||
"name": "Label",
|
||||
"type": "dropdown",
|
||||
"value": "Choose one...",
|
||||
"required": false,
|
||||
"readOnly": false,
|
||||
"overrideId": false,
|
||||
"colspan": 1,
|
||||
"placeholder": null,
|
||||
"minLength": 0,
|
||||
"maxLength": 0,
|
||||
"minValue": null,
|
||||
"maxValue": null,
|
||||
"regexPattern": null,
|
||||
"optionType": null,
|
||||
"hasEmptyValue": true,
|
||||
"options": [
|
||||
{
|
||||
"id": "empty",
|
||||
"name": "Choose one..."
|
||||
},
|
||||
{
|
||||
"id": "option_1",
|
||||
"name": "test1"
|
||||
},
|
||||
{
|
||||
"id": "option_2",
|
||||
"name": "test2"
|
||||
},
|
||||
{
|
||||
"id": "option_3",
|
||||
"name": "test3"
|
||||
}
|
||||
],
|
||||
"restUrl": null,
|
||||
"restResponsePath": null,
|
||||
"restIdProperty": null,
|
||||
"restLabelProperty": null,
|
||||
"tab": null,
|
||||
"className": null,
|
||||
"params": {
|
||||
"existingColspan": 1,
|
||||
"maxColspan": 2
|
||||
},
|
||||
"dateDisplayFormat": null,
|
||||
"layout": {
|
||||
"row": -1,
|
||||
"column": -1,
|
||||
"colspan": 1
|
||||
},
|
||||
"sizeX": 1,
|
||||
"sizeY": 1,
|
||||
"row": -1,
|
||||
"col": -1,
|
||||
"visibilityCondition": null,
|
||||
"endpoint": null,
|
||||
"requestHeaders": null
|
||||
},
|
||||
{
|
||||
"fieldType": "FormFieldRepresentation",
|
||||
"id": "Date",
|
||||
"name": "Date",
|
||||
"type": "date",
|
||||
"value": null,
|
||||
"required": false,
|
||||
"readOnly": false,
|
||||
"overrideId": false,
|
||||
"colspan": 1,
|
||||
"placeholder": null,
|
||||
"minLength": 0,
|
||||
"maxLength": 0,
|
||||
"minValue": null,
|
||||
"maxValue": null,
|
||||
"regexPattern": null,
|
||||
"optionType": null,
|
||||
"hasEmptyValue": null,
|
||||
"options": null,
|
||||
"restUrl": null,
|
||||
"restResponsePath": null,
|
||||
"restIdProperty": null,
|
||||
"restLabelProperty": null,
|
||||
"tab": "tab1",
|
||||
"className": null,
|
||||
"params": {
|
||||
"existingColspan": 1,
|
||||
"maxColspan": 2
|
||||
},
|
||||
"dateDisplayFormat": null,
|
||||
"layout": {
|
||||
"row": -1,
|
||||
"column": -1,
|
||||
"colspan": 1
|
||||
},
|
||||
"sizeX": 1,
|
||||
"sizeY": 1,
|
||||
"row": -1,
|
||||
"col": -1,
|
||||
"visibilityCondition": null
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"outcomes": [],
|
||||
"javascriptEvents": [],
|
||||
"className": "",
|
||||
"style": "",
|
||||
"customFieldTemplates": {},
|
||||
"metadata": {},
|
||||
"variables": [],
|
||||
"customFieldsValueInfo": {},
|
||||
"gridsterForm": false,
|
||||
"globalDateFormat": "D-M-YYYY"
|
||||
}
|
||||
```
|
||||
Please give a look to the [demo-form](docassets/demo-form.json) as a sample of form definition JSON.
|
||||
|
||||
The component below with the form definition JSON assigned to the variable `formDefinitionJSON`, shows how a form is rendered by using form definition JSON.
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user