indicative icon indicating copy to clipboard operation
indicative copied to clipboard

Using Regex for email validation

Open antonioOrtiz opened this issue 4 years ago • 3 comments

Thank you for such a awesome project! It's very elegant!

Package version

"indicative": "^7.4.4",

Node.js and npm version

v13.12.0

At first I used the email rule but noticed a bug where the validation would stop (causing my message to disappear) when reaching the @ symbol, So the user could conceivably enter something like foo@gmail, so I figured why not use a regex; With the Regex the message persists despite entering a valid email...

See below.

Sample Code (to reproduce the issue)

      var data = {
        username: username,
        password: password
      };

      var schema = {
        username: [
          validations.regex([
            new RegExp(
              '/^(([^<>()[]\\.,;:s@"]+(.[^<>()[]\\.,;:s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/'
            )
          ])
        ],
        password: 'min:7|max:11'
      };
      var messages = {
        regex: 'Make sure this is a valid email!!',
        min: 'The value is too short',
        max: 'The value is too long'
      };

      validateAll(data, schema, messages)
        .then(success => {
          if (success.username) {
            console.log('success.username ', success.username);
            setUsernameError(false);
          }

          if (success.password) {
            console.log('success.password ', success.password);
            setPasswordError(false);
          }
          if (success.username && success.password) {
            console.log('success.username ', success.username);
            setDisableButton(false);
          }
        })
        .catch(errors => {
          console.log('errors ', errors);
          if (errors[0].field === 'username') {
            setUsernameError(true);
            setDisableButton(true);
            setUsernameFeedback(errors[0].message);
          }

          if (errors[0].field === 'password') {
            setPasswordError(true);
            setDisableButton(true);
            setPasswordFeedback(errors[0].message);
          }
        });

BONUS (a sample repo to reproduce the issue)

FormComponent validate

antonioOrtiz avatar Apr 07 '20 19:04 antonioOrtiz

This is still an issue

FunbiOyede avatar May 14 '21 14:05 FunbiOyede

Hey @FunbiOyede! 👋

It is tough to validate an email, you may not know it, but test@ch is a valid email address. The only rule to have a valid address is to have @ inside it.

RomainLanz avatar May 14 '21 16:05 RomainLanz

Yes, @RomainLanz I totally understand what you mean. But I wanted more rules to be involved in the email validation.

FunbiOyede avatar May 16 '21 14:05 FunbiOyede