Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom component, children create duplicate key #5747

Open
Jacopops opened this issue Aug 14, 2024 · 2 comments
Open

Custom component, children create duplicate key #5747

Jacopops opened this issue Aug 14, 2024 · 2 comments

Comments

@Jacopops
Copy link

Jacopops commented Aug 14, 2024

Describe the bug
When I drag a new custom component into the module and there is another one already inserted, the keys of the children are not updated but only of the parent causing duplicate keys for each component inserted

Version/Branch
5.3.0

To Reproduce
Steps to reproduce the behavior:

  1. Create form
  2. Add multiple custom component
  3. show the json
  4. check the duplicate key

Expected behavior
The same of the parent key, add a number based on how much component there are in a form

Screenshots
First element json:

image

Second element json:

image

Additional context
Code of custom component:

H2OIndirizzo: {
                        title: 'Indirizzo',
                        key: 'H2OIndirizzo',
                        icon: 'home',
                        schema: {
                            label: 'Indirizzo',
                            type: 'card',
                            key: 'h2o_indirizzo',
                            components: [{
                                label: 'Regione',
                                type: 'select',
                                key: 'regione',
                                input: true,
                                case: "uppercase",
                                validate: {
                                    required: true
                                }
                            }, {
                                label: 'Provincia',
                                type: 'select',
                                key: 'provincia',
                                input: true,
                                case: "uppercase",
                                validate: {
                                    required: true,
                                    maxLength: 2
                                }
                            }, {
                                label: 'Comune',
                                type: 'select',
                                key: 'comune',
                                input: true,
                                validate: {
                                    required: true
                                }
                            }, {
                                label: 'Indirizzo',
                                type: 'textfield',
                                key: 'indirizzo',
                                input: true,
                                validate: {
                                    required: true
                                }
                            }, {
                                label: 'Numero civico',
                                type: 'textfield',
                                key: 'numerocivico',
                                input: true,
                                validate: {
                                    required: true
                                }
                            }, {
                                label: 'CAP',
                                type: 'number',
                                key: 'cap',
                                input: true,
                                mask: false,
                                tableView: false,
                                delimiter: false,
                                requireDecimal: false,
                                inputFormat: "plain",
                                truncateMultipleSpaces: false,
                                validate: {
                                    max: 99999,
                                    required: true
                                }
                            }]
                        }
                    }

And I discovered that by changing the type of component in a card this problem does not happen

@Jacopops Jacopops changed the title Component custom children create duplicate key Custom component, children create duplicate key Aug 14, 2024
@lane-formio
Copy link
Contributor

Sorry, but I noticed you put the version as 5.3.0. What is version 5.3.0? Because our most edge version of formiojs is 5.0.0-rc.72

@Jacopops
Copy link
Author

Sorry is the @formio/react package.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants