| | |
| | | // Dependencies still need checking |
| | | if (this.dependencies.has(field.dataset.field)) { |
| | | let dependency = this.dependencies.get(field.dataset.field); |
| | | dependency.items.forEach(item => { |
| | | dependency.forEach(item => { |
| | | this.checkFieldDependency(item, field.dataset.field); |
| | | }); |
| | | } |
| | |
| | | //Dependencies |
| | | if (this.dependencies.has(field.dataset.field)) { |
| | | let dependency = this.dependencies.get(field.dataset.field); |
| | | dependency.items.forEach(item => { |
| | | dependency.forEach(item => { |
| | | this.checkFieldDependency(item, field.dataset.field); |
| | | }); |
| | | } |
| | |
| | | ui: window.uiFromSelectors(this.selectors.forms, form) |
| | | }; |
| | | |
| | | config.ui.fields = {}; |
| | | form.querySelectorAll('[data-field]').forEach((field) => { |
| | | config.ui.fields[field.dataset.field] = field; |
| | | }); |
| | | |
| | | this.initializeFields(form, config); |
| | | this.forms.set(formId, config); |
| | | |
| | |
| | | } |
| | | // Clean up dependencies for this form |
| | | this.dependencies.forEach((dependency, fieldName) => { |
| | | dependency.items = dependency.items.filter(item => item.form !== formId); |
| | | dependency = dependency.filter(item => item.form !== formId); |
| | | |
| | | // Remove the dependency entry entirely if no items left |
| | | if (dependency.items.length === 0) { |
| | | if (dependency.length === 0) { |
| | | this.dependencies.delete(fieldName); |
| | | } |
| | | }); |
| | |
| | | const requiredValue = field.dataset.dependsValue; |
| | | const operator = field.dataset.dependsOperatior??'=='; |
| | | |
| | | let formData = this.forms.get(form.dataset.formId); |
| | | |
| | | if (!this.dependencies.has(dependsOn)) { |
| | | let element = document.querySelector(`[field="${dependsOn}"]`); |
| | | if (element) { |
| | | this.dependencies.set(dependsOn, { |
| | | element: element, |
| | | items: [] |
| | | }); |
| | | if (Object.hasOwn(formData.ui.fields, dependsOn)) { |
| | | this.dependencies.set(dependsOn, []); |
| | | } |
| | | } |
| | | let dependency = this.dependencies.get(dependsOn); |
| | | dependency.items.push({ |
| | | if (dependency) { |
| | | dependency.push({ |
| | | field: field, |
| | | form: form.dataset.formId, |
| | | requiredValue: requiredValue, |
| | | operator: operator |
| | | }); |
| | | this.dependencies.set(dependsOn, dependency); |
| | | this.checkFieldDependency(dependency, dependsOn); |
| | | } |
| | | |
| | | this.checkFieldDependency(field, dependsOn); |
| | | }); |
| | | } |
| | | checkFieldDependency(dependentField, controlFieldName) { |
| | | const form = this.getForm(dependentField); |
| | | const controlField = this.dependencies.get(controlFieldName); |
| | | if (!controlField) return; |
| | | |
| | | const controlValue = this.getFieldCheckedValue(controlField.element); |
| | | |
| | | const controlValue = this.getFieldValue(form.ui.fields[controlFieldName]); |
| | | const shouldShow = this.evaluateCondition( |
| | | controlValue, |
| | | dependentField.requiredValue, |
| | | dependentField.operator |
| | | dependentField.dataset.dependsValue, |
| | | dependentField.dataset.dependsOperatior |
| | | ); |
| | | |
| | | this.toggleFieldVisibility(dependentField.field, shouldShow); |
| | | this.toggleFieldVisibility(dependentField, shouldShow); |
| | | } |
| | | evaluateCondition(value, requiredValue, operator) { |
| | | const fieldStr = String(value || ''); |