https://www.nsolf.org/_assets/fd3d67d6f622faf52ec5115b5fc51a95/JavaScript/radio.js?1745609378

1window.addEventListener('DOMContentLoaded', (event) => {
2    document.querySelectorAll('.radio-plus').forEach(radio => {
3        /** @type {HTMLInputElement} The actual clickable radio button */
4        const button = radio.querySelector('.radio-plus-other-input');
5        /** @type {HTMLSpanElement} The editable span containing the user-input value */
6        const span = radio.querySelector('.radio-plus-other-span');
7
8        window.Parsley.on('form:init', e => {
9            // set "multiple" attribute on editable span to match radios
10            span.setAttribute('data-parsley-multiple', button.getAttribute('data-parsley-multiple'));
11        });
12
13        span.addEventListener('focusout', e => {
14            span.style.width = window.getComputedStyle(span, ':before').width;
15        });
16        span.style.width = window.getComputedStyle(span, ':before').width;
17
18        button.addEventListener('focusin', e => {
19            if (e.relatedTarget !== span) {
20                span.focus();
21            }
22            return true;
23        });
24
25        span.addEventListener('input', e => {
26            button.value = span.innerText.trim();
27            if (span.textContent.length === 0 && button.checked) {
28                button.setCustomValidity('Custom choice cannot be empty');
29            } else {
30                button.setCustomValidity('');
31            }
32            const event = new Event('input', {bubbles: true});
33            button.dispatchEvent(event);
34            e.preventDefault();
35            e.stopPropagation();
36        });
37
38        span.addEventListener('focusin', e => {
39            button.checked = true;
40            button.setAttribute('checked', true);
41            const event = new Event('input', {bubbles: true});
42            button.dispatchEvent(event);
43        });
44
45        // prevent multiple lines
46        span.addEventListener('keydown', e => {
47            if (e.key === 'Enter') {
48                e.preventDefault();
49            } else {
50                if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
51                    button.focus();
52                    try {
53                        button.dispatchEvent(e);
54                    } catch (err) {
55
56                    }
57                }
58            }
59        });
60
61        span.addEventListener('blur', e => {
62            const formatter = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' });
63            span.innerHTML = formatter.format(span.innerHTML.replace(/[^.\d]/g, ''));
64        });
65
66        radio.addEventListener('focusout', e => {
67            if (button.checked) {
68                if (span.textContent.trim().length === 0) {
69                    button.setCustomValidity('Custom choice cannot be empty');
70                    return;
71                }
72            }
73            button.setCustomValidity('');
74        });
75    });
76});