formio / formio.js

JavaScript powered Forms with JSON Form Builder
https://formio.github.io/formio.js
MIT License
1.89k stars 1.06k forks source link

[BUG] - Cannot focus Select component errors inside an edit grid via clicking the form validation errors #5431

Closed llaurentiu closed 2 months ago

llaurentiu commented 11 months ago

Cannot navigate via form validation errors to an invalid select field inside an edit grid, when submiting draft submissions.

  1. Having a form with an edit grid edited in modal, that has components of type select that are required (or any type of validation that can be triggered)
  2. Save a submission in draft state
  3. Edit the submission & try to submit it ( state = submitted)
  4. Click on the validation error related to the select component

Expected behavior: edit grid row modal is opened and the invalidSelect field is focused.

Current behavior: nothing happens.

JS fiddle here (for latest stable version, but also for lower versions): https://jsfiddle.net/llaurentiu/kg1odh4s/26/

Notice that navigating to a text field works, or navigating to the Select after previously focusing the a Text field error for instance.

theprogrammerinyou commented 10 months ago

Hi, can you post a loom regarding the issue, bit unclear and would be happy to take this up.

llaurentiu commented 9 months ago

Hi, can you post a loom regarding the issue, bit unclear and would be happy to take this up.

Hi, sorry for the late reply.

There is already a jsfiddle attached. Try to submit the form and click on the validation error for the "Country" field. It should open the modal and focus the component, but it doesn't. image

Basically the select component should call beforeFocus of the parent component. Below is an extended select component that overrides the focus method - which fixes the issue.

` focus() {

     if (typeof this.parent?.beforeFocus === 'function' && !this['focusableElement']) {

        this.parent.beforeFocus(this);

     }

     return super.focus();

} `

theprogrammerinyou commented 9 months ago

Hi, Thanks for the reply, can you assign this to me so that i can work on this?

llaurentiu commented 9 months ago

Hi, Thanks for the reply, can you assign this to me so that i can work on this?

Don't seem to be able to do that - but I don't see why anyone else cannot come with MRs on this :)

Tatsiana8 commented 2 months ago

Thank you for your contribution. As this issue has been inactive for over 90 days, I will close it for now. If you wish to reopen the issue, please respond and we can resume the triage process.