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

Problem with listening to the validaion of the text field #444

Open
ulullul opened this issue Mar 4, 2024 · 0 comments
Open

Problem with listening to the validaion of the text field #444

ulullul opened this issue Mar 4, 2024 · 0 comments

Comments

@ulullul
Copy link

ulullul commented Mar 4, 2024

Hello, thank you for a beautiful package.

I have an issue with listening to the validation of the text field.

Basically, I want to show the suffix icon when the validation message appears (the showErrors logic is unchanged from my side).

Here is the video of how it works now.

2024-03-04.23.51.41.mov

I'm trying to achieve this with the following code:

// build method
suffixIcon: ReactiveStatusListenableBuilder(
                  formControl: widget.formControl,
                  builder: (_, control, __) {
                    print('invalid: ${control.invalid}');
                    print('touched ${control.touched}');
                    return _getSuffixIcon(control);
                  },
                ),
// _getSuffixIcon
Widget _getSuffixIcon(AbstractControl formControl) {
    final isError = formControl.invalid && formControl.touched;
    if (widget.obscureText) {
      return _IconContainer.suffix(
        onTap: () {
          setState(() {
            _obscureText = !_obscureText;
          });
        },
        color: isError ? Theme.of(context).colorScheme.error : null,
        child: _obscureText
            ? const Icon(Icons.visibility_off)
            : const Icon(Icons.visibility),
      );
    }
    if (isError) {
      return _IconContainer.suffix(
        color: Theme.of(context).colorScheme.error,
        child: const Icon(Icons.error),
      );
    }
    if (widget.suffixIcon != null) {
      return _IconContainer.suffix(
        child: widget.suffixIcon!,
      );
    }
    return const SizedBox.shrink();
  }

But unfortunately, formControl.touched isn't fired when I move focus to another field, it fires only after remove focus => back focus => type a character.

Here is a small reproducible example.

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

1 participant