Question T13994
Visible to All Users
Duplicate

We have closed this ticket because another page addresses its subject:

Question: does SCv2 supports custom validators different than expression?

Custom Registered Validator in Property Grid

created a year ago

Hello,

suppose I have the following Regex validator in my survey:

JSON
"validators": [ { "type": "regex", "text": { "de": "Kein gültiger Name", "default": "Not a valid name" }, "regex": "^[\\w'\\-,.][^0-9_!¡?÷?¿/\\\\+=@#$%ˆ&*(){}|~<>;:[\\]]{1,}$" } ]

I don't want to repeat the definitions of text and regex properties for each question.
Instead, I want to define it once and then use just by referencing the type.
The built-in validators already allow this: "validators": [ { "type": "email" } ].

I looked at the source code on GitHub, and since my validators are based on regular expressions, I'm re-using the email validator class:

TypeScript
class NameValidator extends SurveyValidator { private re = /^[\w'\-,.][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*(){}|~<>;:[\]]{1,}$/; constructor() { super(); } public getType(): string { return "namevalidator"; } public validate( value: any, name: string = null, values: any = null, properties: any = null ): ValidatorResult { if (!value) return null; if (this.re.test(value)) return null; return new ValidatorResult(value, this.createCustomError(name)); } protected getDefaultErrorText(): string { return validatorError.name[parseLocale(this.getLocale())]; } } Serializer.addClass("namevalidator", [], () => new NameValidator(), "surveyvalidator");

The above works and I'm able to use it by entering the following in my survey definition:
"validators": [ { "type": "name" } ]
The check runs and I get my localized error message just fine.

However, this custom validator does not show up in the dropdown menu:
Clipboard-File-1.png

Any advice on how to make an available to users in the property grid?

Thanks,

Lucas

Answers approved by surveyjs Support

created a year ago

Hello Lucas,
Thank you for sharing the code. To display a custom Name validator in a list of available Text question validators, please add the 'name' entry to the settings.supportedValidators collection:

JavaScript
import { settings } from "survey-core"; settings.supportedValidators.text.push("name");

Clipboard-File-1.png

Additionally, you can use Survey Form Library and Creator localization to specify the caption for a custom Name validator, and the error messages. Consider this example:

JavaScript
import { SurveyValidator, Serializer, ValidatorResult, surveyLocalization } from "survey-core"; import { editorLocalization } from "survey-creator-core"; surveyLocalization.locales.en.nameErrorText = "Invalid input. The string must start with an alphanumeric character, an apostrophe, a hyphen, a comma, or a period. The following characters are not allowed after the first character: digits, underscores, exclamation marks, upside-down exclamation marks, question marks, division symbols, upside-down question marks, forward slashes, backslashes, plus signs, equal signs, at symbols, hash symbols, percent signs, caret symbols, ampersands, asterisks, parentheses, curly braces, vertical bars, tilde, less than, greater than, semicolons, colons, or square brackets. The input must be at least one character long."; editorLocalization.getLocale("").validators.namevalidator = "Name"; editorLocalization.getLocale("").p.nameErrorText = "Invalid input. The string must start with an alphanumeric character, an apostrophe, a hyphen, a comma, or a period. The following characters are not allowed after the first character: digits, underscores, exclamation marks, upside-down exclamation marks, question marks, division symbols, upside-down question marks, forward slashes, backslashes, plus signs, equal signs, at symbols, hash symbols, percent signs, caret symbols, ampersands, asterisks, parentheses, curly braces, vertical bars, tilde, less than, greater than, semicolons, colons, or square brackets. The input must be at least one character long.";

View Demo

Please let me know if you have any questions or require further assistance.

P.S. We hope you enjoyed the level of service you received. If so, we would love if you could leave your feedback on SurveyJS page at g2.com. As we’re building our business, every review helps build credibility for future customers and your feedback would be greatly appreciated.

    Comments (2)
    LF LF
    Lucas Forster a year ago

      Hello Jane,

      I registered my validators through settings.supportedValidators and set the label using getLocale("").validators successfully.

      I told my manager about the review website and she created an account, you can expect a review from us probably within the next weeks.

      Thanks

      Lucas

        You're always welcome, Lucas. Please feel free to contact us if you have any questions or require further assistance.