Typed input of type 're' (i.e. regular expresssion)

[BartButenaers]

Hi folks,

I want to enter a text into a typedinput, but there should be a visible indication when the text does not match a specified regular expression.

I see that the typedinput allows to use regular expressions:

Can that be used for my purpose? And could anybody provide a simple example? I certainly must be overthinking it, but I am not sure how to specify my regex...

Thanks!!
Bart

[Steve-Mcl]

Not quite following Bart. Can you provide an annotated screen shot describing what you are seeing and what you expect to see?

[BartButenaers]

Hey Steve,
I have no screen yet for this part. Currently I have a simple text input element, with a regex to validate the input based on some pattern. For example:

<input type="text" name="country_code" pattern="[A-Za-z]{3}">

Now I would like to do something similar with a TypedInput. So I thought that I could use identifier "re" instead of "str" (see screenshot above).

But from your response I assume the "re" identifier is used for a complete other purpose?

Thanks!

[Steve-Mcl]

So, the re input is to provide a means of letting a user enter a regex, not for validating users input.

If you simply want to validate user input you can do that use a validator (you can even use regex in your validation).

        defaults: {
            myString: {
                value: "",
                validate: RED.validators.regex(/[A-Za-z]{3}/)
            },
            ...
        }

Perhaps if you provide context to the task at hand I can better help?

[BartButenaers]

@Steve-Mcl

the re input is to provide a means of letting a user enter a regex

Ah that explains my confusion. Indeed I thought it was used for validating an input based on a regex, and I had no idea where to specify that regex

So my case is this: some property needs to be a string, that needs to contain a pattern. The string can be hardcoded in the config screen, or injected via an input message. So the types of my TypedInput are ["str", "msg"]. But in the config screen the pattern matching test should only be applied when type is "str", not for "msg".

While writing my problem down here, I assume you are going to tell me that I need a validation function that only checks the pattern if type is "str"...

[knolleary]

You can define your own type that is a copy of the str type, but with your added custom validation rule:

types: [
    {
        value: "str",
        label: "Bart's String",
        icon: "red/images/typedInput/az.svg",
        validate: function (value, opt) {
            // return true/false depending on if `value` is valid or not
        }
    },
    'msg'
]

[BartButenaers]

Ah ok, that is indeed much more readable compare to a general validation function that depends on the type.
Thanks guys and enjoy your weekend!

[GogoVega]

I add that you can also return a string which will be the error message displayed by the input.