Posted on by

Regexes with a Blank Alternative

I sometimes get requests that the regex field validation allow for a blank entry or if there is an entry, it must follow a specific pattern. Like an optional email address that you want to be valid if it’s entered. This is possible, it’s just a matter of creating a regex that allows a blank alternative. This is done using two regex techniques: alternatives and anchors.

An alternative is a way to offer several alternative regex patterns to try. You simply separate your patterns with a pipe | character, and it treats them as an “or” condition.

Anchors are a way to enforce that the pattern is applied to all of the input. (They can also be used to force a pattern to match the beginning or end of the input.) Anchors give us a way to define a pattern that matches an empty input: ^$ so, we use that as the alternative to our email validity pattern:

/^[A-Za-z0-9._%+-][email protected][A-Za-z0-9.-]+\.[A-Za-z]{2,4}$|^$/

And that’s it: if they enter anything, it has to be a valid email address. If they enter nothing, it still validates.

You can use this technique for any kind of validation, just replace the email validator in the above expression with the desired validation, for example this simple validation for typing in a 4-digit numeral, like a year:

/^[0-9]{4}$|^$/

Hiding the Required Marker

If you want to prevent the “required” marker from appearing on a field that is optional, you can do this with a bit of CSS that targets a specific field.

For example, to hide the required marker on a field named “last_name” use a CSS rule like this:

.last_name-input-group .reqd {
    display: none;
}

You can adapt that to any field, just replace “last_name” with the name of the field you want to hide the marker on…you can of course do this for multiple fields if needed.

These rules can be placed in the plugins settings under the “Custom CSS” tab.

6 thoughts on “Regexes with a Blank Alternative

  1. Hello, I am having trouble using this code you suggest. I would like the field to accept an exact word match or a blank entry. The form element is “text-line” and the Default or Values are both blank. The regex/match validation reads /^hopejlt$|^$/, which means the element should accept either hopejlt or no entry in the field. However, upon testing, it seems that the blank option is not being recognized. It generates an error saying that the “field is required”. Seems like its expecting some value even though I specified a blank entry as okay. Any help would be appreciated!

    1. You’re doing it right…I found a bug that wasn’t allowing a blank value.

      There is a new version of the plugin out soon that fixes it.

      1. Hi Roland,

        I just tested the alternative with empty strings appendig to my regex for URIs but experienced the same behaviour: The field is marked as required and I cannot save any data.

        I used the follwoing regex:
        #^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$|^$#
        or
        #^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$|^\s*$#

        What did I wrong?

        1. Hi Stefan,

          I can’t tell what is wrong with the regexes you are trying, I suggest you test your regex on this page: https://regex101.com/

          The first of the two looks like the better choice because if they don’t enter anything it will be an empty string, not spaces.

          It will give you very helpful feedback on how your regexes are working by debugging it and letting you test some actual inputs.

        2. Thanx. for the fast reply!
          The regex-expressions seem to be ok. Is it the same interpreter?
          I recogniced that this test-page doesn’t accept http://test which is correct, but pdb does accept it.

          regards stefan

        3. I don’t know what is going on there…this is working as expected in my tests here. I guess check to make sure your regex is correctly copied into the field validation setting?

Leave a Reply
You have to agree to the comment policy.

Would you like to be notified of followup comments via e-mail? You can also subscribe without commenting.

6 thoughts on “Regexes with a Blank Alternative

  1. Hello, I am having trouble using this code you suggest. I would like the field to accept an exact word match or a blank entry. The form element is “text-line” and the Default or Values are both blank. The regex/match validation reads /^hopejlt$|^$/, which means the element should accept either hopejlt or no entry in the field. However, upon testing, it seems that the blank option is not being recognized. It generates an error saying that the “field is required”. Seems like its expecting some value even though I specified a blank entry as okay. Any help would be appreciated!

    1. You’re doing it right…I found a bug that wasn’t allowing a blank value.

      There is a new version of the plugin out soon that fixes it.

      1. Hi Roland,

        I just tested the alternative with empty strings appendig to my regex for URIs but experienced the same behaviour: The field is marked as required and I cannot save any data.

        I used the follwoing regex:
        #^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$|^$#
        or
        #^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$|^\s*$#

        What did I wrong?

        1. Hi Stefan,

          I can’t tell what is wrong with the regexes you are trying, I suggest you test your regex on this page: https://regex101.com/

          The first of the two looks like the better choice because if they don’t enter anything it will be an empty string, not spaces.

          It will give you very helpful feedback on how your regexes are working by debugging it and letting you test some actual inputs.

        2. Thanx. for the fast reply!
          The regex-expressions seem to be ok. Is it the same interpreter?
          I recogniced that this test-page doesn’t accept http://test which is correct, but pdb does accept it.

          regards stefan

        3. I don’t know what is going on there…this is working as expected in my tests here. I guess check to make sure your regex is correctly copied into the field validation setting?

Leave a Reply
You have to agree to the comment policy.

Would you like to be notified of followup comments via e-mail? You can also subscribe without commenting.