angular
angular copied to clipboard
[Custom Components] Unable to update inherited editform values
Environment:
formiojs: ^4.14.1 formio/angular : ^5.3.0-rc.2 angular:13.3.11
I'm making a custom radio component, inheriting the radio editFormfrom formio, as an example below:
import { Components } from 'formiojs';
const COMPONENT_OPTIONS: FormioCustomComponentInfo = {
type: 'custom-radio',
selector: 'custom-radio',
title: 'Radio',
group: 'basic',
icon: 'stop-circle-o',
editForm: Components.components.radio.editForm, <----------------------
schema: {tableView: true},
fieldOptions: ['key', 'label', 'values','value', 'disabled', 'validate']
};
The base code equivalent of the values field is as follows:
{
"type": "datagrid",
"input": true,
"label": "Values",
"key": "values",
"tooltip": "The radio button values that can be picked for this field. Values are text submitted with the form data. Labels are text that appears next to the radio buttons on the form.",
"weight": 10,
"reorder": true,
"defaultValue": [
{
"label": "",
"value": ""
}
],
"components": [
{
"label": "Label",
"key": "label",
"input": true,
"type": "textfield"
},
{
"label": "Value",
"key": "value",
"input": true,
"type": "textfield",
"allowCalculateOverride": true,
"calculateValue": "value = _.camelCase(row.label);",
"validate": {
"required": true
}
},
{
"type": "select",
"input": true,
"weight": 180,
"label": "Shortcut",
"key": "shortcut",
"tooltip": "The shortcut key for this option.",
"dataSrc": "custom",
"valueProperty": "value",
"template": "{{ item.label }}",
"data": {}
}
]
}
In the editform of my custom component I'm doing this:
{
key: "values",
label: "test", //not working
reorder: false, //not working
components: [
{
key: "shortcut",
ignore: true, //working
},
{
key: "value",
label: "test2", //working
}
],
calculateValue(context) {
console.log(context.value); //working
return context.value;
}
}
However, no changes to the parent component (values) are reflected. What I managed to change was the child components. How can I modify data, such as label, reorder, among others of the parent component?