fomantic / Fomantic-UI

Fomantic-UI is the official community fork of Semantic-UI
https://fomantic-ui.com
MIT License
3.52k stars 329 forks source link

fix(form) duplicate error displays on invalid form field value #3067

Open BrianJavier99 opened 1 week ago

BrianJavier99 commented 1 week ago

Description

Adds a variable formErrorsTracker that tracks which field identifiers have already pushed an error prompt in the formErrors variable which limits the number of error prompt for every field identifier into 1.

Test

https://jsfiddle.net/94oer63c/

Screenshot (if possible)

image

Closes

2923

BrianJavier99 commented 1 week ago

Thanks, it basically works, but the extra newIdentifier check isn't needed. Please see my comments

Hello @lubber-de, the reason why I added a newIdentifier variable is to avoid an error popping up in the console: image

When I investigated the root cause, I discovered the cause being the call to module.add.prompt() have the fieldErrors variable as an argument, which was empty since we now check if the error prompt is a duplicate before pushing it to the fieldErrors array.

This means that while nothing will be concatenated to the formErrors array, the subsequent lines, module.add.prompt and settings.onInvalid.call, will still also be called with null or empty arguments and will prompt errors.

However while typing this out, I have thought out of a better implementation, which is to check if the fieldErrors array has no content instead.

BrianJavier99 commented 1 week ago

@lubber-de , sorry for the delay. With my recent commits I have tried addressing the cases that you have specified.

Below are the new behaviors.

Not Inline, error limit 0: image

Not Inline, error limit 1: image

Inline, error limit 0: image

Inline, error limit 1: image

Please let me know if I have missed any scenario or failed to consider a certain feature/functionality. Thank you.

lubber-de commented 6 days ago

Please fix the linting issues 😉

BrianJavier99 commented 6 days ago

While fixing linting issues, I have encountered some bugs:

A formerly valid field does not display the error prompt once it becomes invalid again: image

Conversely, a formerly invalid field does not remove the error prompt once it becomes valid again: image

Will try to fix these issues within this week.

BrianJavier99 commented 2 days ago

Hello again @lubber-de,

I was only able to get back on this today. It seems that the issue I have previously discovered arose due to the fact that the error prompts are added/removed to the field groups as a whole and it lacks the functionality to iterate on every field with a similar identifier. This issue is unrelated from this issue and is replicable in the develop branch (I have used your fiddle).

I propose that we put the issue into another ticket and proceed with the merging of this PR should there be no other concerns anymore.

Please let me know what you think, thanks.