reactive_forms icon indicating copy to clipboard operation
reactive_forms copied to clipboard

MustMatchValidator not working with ReactiveFormsGenerator & Freezed

Open Dionnie123 opened this issue 1 year ago • 5 comments

@freezed
@Rf()
class RegisterForm with _$RegisterForm {
  // ignore: invalid_annotation_target
  @JsonSerializable(fieldRename: FieldRename.snake)
  factory RegisterForm({
    @RfControl(validators: [RequiredValidator()]) String? fullName,
    @RfControl(validators: [RequiredValidator()]) String? email,
    @RfControl(validators: [RequiredValidator()]) String? password,
    @RfControl(validators: [
      RequiredValidator(),
      MustMatchValidator(
        'password',
        'passwordConfirmation',
        true,
      )
    ])
    String? passwordConfirmation,
    @RfControl(validators: [RequiredTrueValidator()]) bool? acceptLicense,
  }) = _RegisterForm;

  factory RegisterForm.fromJson(Map<String, dynamic> json) =>
      _$RegisterFormFromJson(json);
}
RegisterFormFormBuilder(builder: (x, f, c) {
                        return Padding(
                          padding: const EdgeInsets.all(25.0),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              const BoxText.headline('SIGN UP'),
                              const BoxText.caption('Enter your details below'),
                              verticalSpaceMedium,
                              ReactiveTextField<String>(
                                formControl: f.fullNameControl,
                                validationMessages: {
                                  ValidationMessage.required: (_) => 'Required',
                                },
                                textInputAction: TextInputAction.done,
                                decoration: const InputDecoration(
                                  labelText: "Fullname",
                                  helperText: '',
                                  helperStyle: TextStyle(height: 0.8),
                                  errorStyle: TextStyle(height: 0.8),
                                ),
                              ),
                              const SizedBox(height: 8.0),
                              ReactiveTextField<String>(
                                formControl: f.emailControl,
                                validationMessages: {
                                  ValidationMessage.required: (_) => 'Required'
                                },
                                decoration: const InputDecoration(
                                  labelText: 'Email',
                                  helperText: '',
                                  helperStyle: TextStyle(height: 0.8),
                                  errorStyle: TextStyle(height: 0.8),
                                ),
                              ),
                              const SizedBox(height: 8.0),
                              ReactiveTextField<String>(
                                formControl: f.passwordControl,
                                //   obscureText: true,
                                validationMessages: {
                                  ValidationMessage.required: (_) => 'Required'
                                },
                                textInputAction: TextInputAction.done,
                                decoration: const InputDecoration(
                                  labelText: "Password",
                                  helperText: '',
                                  helperStyle: TextStyle(height: 0.8),
                                  errorStyle: TextStyle(height: 0.8),
                                ),
                              ),
                              const SizedBox(height: 8.0),
                              ReactiveTextField<String>(
                                formControl: f.passwordConfirmationControl,
                                //   obscureText: true,
                                validationMessages: {
                                  ValidationMessage.required: (_) => 'Required',
                                  ValidationMessage.mustMatch: (_) =>
                                      "Not match",
                                },
                                textInputAction: TextInputAction.done,
                                decoration: const InputDecoration(
                                  labelText: "Confirm Password",
                                  helperText: '',
                                  helperStyle: TextStyle(height: 0.8),
                                  errorStyle: TextStyle(height: 0.8),
                                ),
                              ),
                              Row(
                                children: [
                                  ReactiveCheckbox(
                                    formControl: f.acceptLicenseControl,
                                  ),
                                  const Text("Accept Privacy and Policy")
                                ],
                              ),
                              verticalSpaceMedium,
                              ReactiveRegisterFormFormConsumer(
                                builder: (context, formModel, child) {
                                  return BoxButton(
                                    title: 'SIGN UP',
                                    disabled: f.form.hasErrors ? true : false,
                                  );
                                },
                              ),
                            ],
                          ),
                        );
                      }

image

Dionnie123 avatar Jul 22 '23 08:07 Dionnie123