ionic-framework
ionic-framework copied to clipboard
Textarea input creating duplicated input when clicking on it
Prerequisites
- [X] I have read the Contributing Guidelines.
- [X] I agree to follow the Code of Conduct.
- [X] I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v7.x
Current Behavior
textarea input is creating another textarea for some miliseconds and then deleting it, but this behaviour is creating a error "Duplicate form field id in the same form". I noticed this by searching for the input id, which only shows once, but I noticed that when clicking on the text area there was some html added underneat and deleted straight away, I recorded the behaviour to analyse it and noticed that the input is being cloned and deleted within a second, I could confirm that the input id is the same as shown in the added image.
This is some times happening to the ion-inputs as well but it is rare.
Expected Behavior
The textarea input should not be cloned when the user click on it (even if this input is created and deleted soon after).
Steps to Reproduce
- Create 2 textare inputs one under the other within the same page but in different form.
- Add 200 characters and save it, The value on next refresh should be the new text added before so the input should be filled up already.
- click on one of the textareas and then on the other and the input gets clonned for some miliseconds as shown in the image above.
Code Reproduction URL
No response
Ionic Info
ionic info [WARN] Error loading @capacitor/ios package.json: Error: Cannot find module '@capacitor/ios/package'
Require stack:
- C:\Users\User\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
- C:\Users\User\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\User\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\User\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic
Ionic:
Ionic CLI : 6.19.0 (C:\Users\User\AppData\Roaming\npm\node_modules@ionic\cli) Ionic Framework : @ionic/vue 7.6.2
Capacitor:
Capacitor CLI : 5.6.0 @capacitor/android : 5.6.0 @capacitor/core : 5.6.0 @capacitor/ios : not installed
Utility:
cordova-res : not installed globally native-run : 2.0.0
System:
NodeJS : v16.20.2 (C:\Program Files\nodejs\node.exe) npm : 9.7.1 OS : Windows 10
Additional Information
No response
Thanks for the issue! This issue has been labeled as needs reproduction
. This label is added to issues that need a code reproduction.
Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.
If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.
For a guide on how to create a good reproduction, see our Contributing Guide.
This issue is being closed due to lack of a reproduction. If this is still a problem in the latest version of Ionic, please open a new issue and ensure the template is fully filled out. Thank you!