https://www.parker.edu/wp-content/plugins/parker-salesforce-integr…/field_handler.js?ver=1784662098

1const FieldHandler = {
2    /**
3     * Transforms multiple fields into boolean radio buttons.
4     * @param {Array} fields - Array of field configurations.
5     * @param {string} fields[].fieldId - The field ID or name.
6     * @param {string} fields[].labelText - The label text for the radio buttons.
7     * @param {HTMLElement|null} fields[].extraElement - Optional extra element (e.g., disclaimer).
8     * @param {boolean} fields[].isHorizontal - Whether the radio buttons should be displayed horizontally.
9     */
10    transformToBooleanRadios(fields) {
11        fields.forEach(({ fieldId, labelText, extraElement = null, isHorizontal = false }) => {
12            this.booleanRadioButtons({ fieldId, labelText, extraElement, isHorizontal });
13        });
14    },
15
16    /**
17     * Converts a field into boolean radio buttons with Yes/No options.
18     * @param {Object} config - Configuration for the radio buttons.
19     * @param {string} config.fieldId - The field ID or name.
20     * @param {string} config.labelText - The label text for the radio buttons.
21     * @param {HTMLElement|null} config.extraElement - Optional extra element (e.g., disclaimer).
22     * @param {boolean} config.isHorizontal - Whether the radio buttons should be displayed horizontally.
23     */
24    booleanRadioButtons({ fieldId, labelText, extraElement = null, isHorizontal = false }) {
25        const formElement = document.querySelector(`#${fieldId}`) || document.querySelector(`[name='${fieldId}']`);
26        if (formElement) {
27            const formGroup = formElement.closest(".form-group");
28            if (formGroup) {
29                // Create the label
30                const label = document.createElement("label");
31                label.innerHTML = labelText;
32
33                // Create the radio buttons
34                const radioTrue = this.createRadioButton(fieldId, "true", "Yes");
35                const radioFalse = this.createRadioButton(fieldId, "false", "No");
36
37                const radioContainer = document.createElement("div");
38                radioContainer.classList.add("form-check-group");
39                if (isHorizontal) {
40                    radioContainer.classList.add("horizontal-radio");
41                }
42                radioContainer.innerHTML = radioTrue + radioFalse;
43
44                // Add fallback hidden input
45                const hiddenInput = this.createHiddenInput(fieldId);
46
47                // Clear and rebuild the form group
48                formGroup.innerHTML = "";
49                formGroup.appendChild(label);
50                formGroup.appendChild(radioContainer);
51                formGroup.appendChild(hiddenInput);
52
53                // Append extra element, if provided
54                if (extraElement) {
55                    formGroup.appendChild(extraElement);
56                }
57
58                // Preserve the initial value if already set
59                this.setInitialValue(fieldId, formElement);
60
61                // Update hidden input value on change
62                this.addRadioChangeListener(fieldId, hiddenInput);
63            }
64        }
65    },
66
67    /**
68     * Creates a single radio button HTML string.
69     * @param {string} fieldId - The field ID or name.
70     * @param {string} value - The value of the radio button.
71     * @param {string} labelText - The label text for the radio button.
72     * @returns {string} - The HTML string for the radio button.
73     */
74    createRadioButton(fieldId, value, labelText) {
75        return `
76            <div class="form-check">
77                <input type="radio" name="${fieldId}" value="${value}" id="${fieldId}_${value}" class="form-check-input">
78                <label for="${fieldId}_${value}">${labelText}</label>
79            </div>
80        `;
81    },
82
83    /**
84     * Creates a hidden input for tracking the field value.
85     * @param {string} fieldId - The field ID or name.
86     * @returns {HTMLElement} - The created hidden input element.
87     */
88    createHiddenInput(fieldId) {
89        const hiddenInput = document.createElement("input");
90        hiddenInput.type = "hidden";
91        hiddenInput.name = fieldId;
92        hiddenInput.value = "false";

92 // Default to "false"
93        return hiddenInput;
94    },
95
96    /**
97     * Sets the initial value for a field's radio buttons based on the current value.
98     * @param {string} fieldId - The field ID or name.
99     * @param {HTMLElement} formElement - The form element to check.
100     */
101    setInitialValue(fieldId, formElement) {
102        const initialValue = formElement.value || formElement.getAttribute("value");
103        const selectedRadio = document.querySelector(`input[name="${fieldId}"][value="${initialValue}"]`);
104        if (selectedRadio) {
105            selectedRadio.checked = true;
106        }
107    },
108
109    /**
110     * Adds a change listener to update the hidden input when a radio button is selected.
111     * @param {string} fieldId - The field ID or name.
112     * @param {HTMLElement} hiddenInput - The hidden input to update.
113     */
114    addRadioChangeListener(fieldId, hiddenInput) {
115        document.querySelectorAll(`input[name="${fieldId}"]`).forEach((radio) => {
116            radio.addEventListener("change", () => {
117                hiddenInput.value = document.querySelector(`input[name="${fieldId}"]:checked`).value;
118            });
119        });
120    },
121
122    /**
123     * Populates the dropdown with the given objects.
124     * @param {HTMLElement} dropdown - The dropdown element to populate.
125     * @param {Array} objects - Array of objects to use for dropdown options.
126     * @param {string} defaultOptionText - The default option text.
127     */
128    populateDropdown(dropdown, objects, defaultOptionText) {
129        dropdown.innerHTML = ''; // Clear existing options
130
131        const defaultOption = document.createElement('option');
132        defaultOption.value = '';
133        defaultOption.textContent = defaultOptionText;
134        dropdown.appendChild(defaultOption);
135
136        objects.forEach(object => {
137            const option = document.createElement('option');
138            option.value = object.name; // Use the object name or a unique identifier
139            option.textContent = object.name;
140            dropdown.appendChild(option);
141        });
142    },
143    /**
144         * Handles multiple visibility configurations.
145         * @param {Array} configurations - List of visibility configurations.
146         * @param {string} configurations[].fieldName - The source field's name.
147         * @param {string} configurations[].targetFieldName - The target field's name.
148         * @param {string} configurations[].expectedValue - The value that makes the target field visible.
149         */
150    handleVisibilities(configurations) {
151        configurations.forEach(({ fieldName, targetFieldName, expectedValue }) => {
152            this.handleVisibility(fieldName, targetFieldName, expectedValue);
153        });
154    },
155
156    /**
157     * Handles the visibility of a single field based on the source field's value.
158     * @param {string} fieldName - The source field's name.
159     * @param {string} targetFieldName - The target field's name.
160     * @param {string} expectedValue - The value that makes the target field visible.
161     */
162    handleVisibility(fieldName, targetFieldName, expectedValue) {
163        const field = document.querySelector(`input[name='${fieldName}']:checked`);
164        const targetField = document.querySelector(`[name='${targetFieldName}']`);
165        const formGroup = targetField?.closest(".form-group");
166
167        parkerDebugLog(`Handling visibility for '${targetFieldName}'`);
168
169        const shouldShow = field?.value === expectedValue;
170        this.toggleVisibility(formGroup, shouldShow);
171    },
172
173    /**
174     * Toggles the visibility of a field's container (e.g., form-group).
175     * @param {HTMLElement} fieldContainer - The field container to toggle (e.g., form-group).
176     * @param {boolean} isVisible - Whether to show or hide the container.
177     */
178    toggleVisibility(fieldContainer, isVisible) {
179        if (fieldContainer) {
180            parkerDebugLog(`Toggling visibility for: ${fieldContainer}`);
181            fieldContainer.style.display = isVisible ? "block" : "none";
182        } else {
183            parkerDebugWarn("Field container not found for toggling visibility.");
184        }
185    }
186};