https://commonpurpose.org/Frontend-Assembly/Telerik.Sitefinity.Fro…?package=Bootstrap5&v=OTI0Mjc5NzQw

1(function ($) {
2    $(function () {
3
4        function processRules(e) {
5            if (typeof $.fn.processFormRules === 'function') {
6                $(e.target).processFormRules();
7            }
8        }
9
10        var delayTimer;
11        function processRulesWithDelay(e) {
12            clearTimeout(delayTimer);
13            delayTimer = setTimeout(function () {
14                processRules(e);
15            }, 300);
16        }
17
18        function handleValidation(e) {
19            if (typeof e.target.validity === 'undefined')
20                return;
21
22            if (e.target.required && e.target.validity.valueMissing) {
23                var validationMessages = getValidationMessages(e.target);
24                setErrorMessage(e.target, validationMessages.required);
25            } else {
26                setErrorMessage(e.target, '');
27            }
28        }
29
30        function onChange(e) {
31            handleValidation(e);
32            processRules(e);
33        }
34
35        function onInput(e) {
36            handleValidation(e);
37            processRulesWithDelay(e);
38        }
39

40        function invalid(e) {
41            if (typeof e.target.validity === 'undefined')
42                return;
43
44            if (_getErrorMessageContainer(e.target)) {
45                e.preventDefault();
46            }
47
48            var validationMessages = getValidationMessages(e.target);
49            var validationRestrictions = getValidationRestrictions(e.target);
50            var isValidLength = e.target.value.length >= validationRestrictions.minLength;
51
52            if (validationRestrictions.maxLength > 0)
53                isValidLength &= e.target.value.length <= validationRestrictions.maxLength;
54
55            if (e.target.validity.valueMissing) {
56                setErrorMessage(e.target, validationMessages.required);
57            }
58            else if (e.target.validity.patternMismatch && !isValidLength) {
59                setErrorMessage(e.target, validationMessages.maxLength);
60            }
61            else if (e.target.validity.patternMismatch && isValidLength) {
62                setErrorMessage(e.target, validationMessages.regularExpression);
63            }
64            else if (!e.target.validity.valid) {
65                setErrorMessage(e.target, validationMessages.invalid);
66            }
67        }
68

69        function getValidationMessages(input) {
70            var container = $(input).parents('[data-sf-role="text-field-container"]');
71            var validationMessagesInput = $(container).find('[data-sf-role="violation-messages"]');
72            var validationMessages = JSON.parse(validationMessagesInput.val());
73
74            return validationMessages;
75        }
76
77        function getValidationRestrictions(input) {
78            var container = $(input).parents('[data-sf-role="text-field-container"]');
79            var validationRestrictionsInput = $(container).find('[data-sf-role="violation-restrictions"]');
80            var validationRestrictions = JSON.parse(validationRestrictionsInput.val());
81
82            return validationRestrictions;
83        }
84
85        function setErrorMessage(input, message) {
86            var errorMessagesContainer = _getErrorMessageContainer(input);
87
88            if (errorMessagesContainer) {
89                _toggleCustomErrorMessage(errorMessagesContainer, message);
90            } else {
91                input.setCustomValidity(message);
92            }
93        }
94
95        function _toggleCustomErrorMessage(container, message) {
96            container.innerText = message;
97
98            if (message === '') {
99                container.style.display = 'none';
100            } else {
101                container.style.display = 'block';
102            }
103        }
104
105        function _getErrorMessageContainer(input) {
106            var container = $(input).closest('[data-sf-role="text-field-container"]')[0];
107            if (container) {
108                var errorMessagesContainer = container.querySelector('[data-sf-role="error-message"]');
109                return errorMessagesContainer;
110            }
111
112            return null;
113        }
114
115        function init() {
116            var containers = $('[data-sf-role="text-field-container"]');
117
118            if (!containers || containers.length < 1)
119                return;
120
121            for (var i = 0; i < containers.length; i++) {
122                var input = $(containers[i]).find('[data-sf-role="text-field-input"]');
123
124                if (input) {
125                    input.on('change', onChange);
126                    input.on('input', onInput);
127                    input.on('invalid', invalid);
128                }
129            }
130        }
131
132        init();
133    });
134}(jQuery));