Form validation for multiple fields | Community
Skip to main content
Frank_Breen2
Frank_Breen2
New Participant
March 4, 2018
Solved

Form validation for multiple fields

  • March 4, 2018
  • 2 replies
  • 6451 views

On occasion people fill out our forms with bad data, for example:

First Name: aaa

Last Name: aaa

Email something@gmail.com

Company Name: aaa

I found this example written by @Sandford Whiteman​: https://codepen.io/figureone/pen/JKzjvE, but it's only works for 1 field at a time, attached is my edited code. What edits do I need to make to get this to work on FirstName, LastName, Company and also stop Freemium email addresses? I've tried combining the examples out on the nation but am getting code conflicts or the form submits without checking my rules.

Best answer by SanfordWhiteman

I'm this @Sanford Whiteman​ actually.

but it's only works for 1 field at a time

Not at all! It's specifically written to be extensible, that's why it says "array of validator objects."

If you wanted to validate both LastName and Website, for example, you'd use:

  var extendedValidators = [
  {
    field: 'LastName',
    pattern: /[0-9]/,
    predicate: false,
    message: 'Last names can\'t have numbers.',
  },
  {
    field: 'Website',
    pattern: /\.example\.com$/i,
    predicate: false,
    message: 'Websites can\'t be example.com sites.',
  }
  ];

Of course this assumes you can express your rules as regular expressions, and not everything fits a regex.  You might want to pass a callback function, which this particular version of the code does not support (I think there's a another demo that does, have to look for it).

In your case, if you want to catch the same character repeated 3 or more times, that's the regex

/(\w)\1{2,}/

But I'd be extremely wary of false positives.  "AAA" is one of the most-well known brands in America, and lots of of small companies prepend "AAA" to their name. For personal names I guess it's pretty sound, but it's hardly the only way to come up with a fake name.

2 replies

lorie_witmer4
lorie_witmer4
New Participant
January 15, 2019

We are receiving a lot of invalid emails that don't have for example ".com" - how do you account for all the different email extensions... ie.  .net, .org, .edu etc.... do you have code the lists all of these to verify that the email is valid?

SanfordWhiteman
SanfordWhiteman
New Participant
January 16, 2019

Lorie, bear in mind there are over 1500 valid TLDs, and that number grows all the time. To not falsely block people you must continually update from the PSL. (Few form design mistakes enrage me more than when people block "new" domains as if they're invalid.) And also realize that No, sandy@gmail isn’t an “incomplete” e-mail address!​.

This is not to say you can't match against the TLD list. If you're ready to maintain such a solution at least every month, it's not hard to read a downloaded PSL from JavaScript. But even matching one of the currently valid TLDs doesn't mean the email is emailable, just that it may be emailable. In order to know that the @domain exists (not just that it may exist) and has an MX record, you'd need to use another solution that does real-time verification.

SanfordWhiteman
SanfordWhitemanAccepted solution
New Participant
March 4, 2018

I'm this @Sanford Whiteman​ actually.

but it's only works for 1 field at a time

Not at all! It's specifically written to be extensible, that's why it says "array of validator objects."

If you wanted to validate both LastName and Website, for example, you'd use:

  var extendedValidators = [
  {
    field: 'LastName',
    pattern: /[0-9]/,
    predicate: false,
    message: 'Last names can\'t have numbers.',
  },
  {
    field: 'Website',
    pattern: /\.example\.com$/i,
    predicate: false,
    message: 'Websites can\'t be example.com sites.',
  }
  ];

Of course this assumes you can express your rules as regular expressions, and not everything fits a regex.  You might want to pass a callback function, which this particular version of the code does not support (I think there's a another demo that does, have to look for it).

In your case, if you want to catch the same character repeated 3 or more times, that's the regex

/(\w)\1{2,}/

But I'd be extremely wary of false positives.  "AAA" is one of the most-well known brands in America, and lots of of small companies prepend "AAA" to their name. For personal names I guess it's pretty sound, but it's hardly the only way to come up with a fake name.

Frank_Breen2
Frank_Breen2Author
New Participant
March 4, 2018

Thanks this worked as expected, for now I'm keeping it to the First, Last and Email fields, as you're totally correct on the Company Name side.

Terms & ConditionsAccessibility statement

Loading footer...