fix: Fixed conditional logic for SELECT and RADIO

Draggable · Feb 23, 2020 · 45f2440 · 45f2440
1 parent 40c8bb6
commit 45f2440
Showing 1 changed file with 30 additions and 12 deletions.
diff --git a/src/js/renderer.js b/src/js/renderer.js
@@ -182,18 +182,23 @@ export default class FormeoRenderer {
 
           ifConditions.forEach(ifCondition => {
             const { source, ...ifRest } = ifCondition
+
             if (isAddress(source)) {
-              const component = this.getComponent(source)
-              const listenerEvent = LISTEN_TYPE_MAP(component)
-              if (listenerEvent) {
-                component.addEventListener(
-                  listenerEvent,
-                  evt =>
-                    this.evaluateCondition(ifRest, evt) &&
-                    thenConditions.forEach(thenCondition => this.execResult(thenCondition, evt)),
-                  false
-                )
-              }
+              const components = this.getComponents(source)
+
+              components.forEach(component => {
+                const listenerEvent = LISTEN_TYPE_MAP(component)
+
+                if (listenerEvent) {
+                  component.addEventListener(
+                    listenerEvent,
+                    evt =>
+                      this.evaluateCondition(ifRest, evt) &&
+                      thenConditions.forEach(thenCondition => this.execResult(thenCondition, evt)),
+                    false
+                  )
+                }
+              })
             }
           })
         })
@@ -242,12 +247,25 @@ export default class FormeoRenderer {
       : this.renderedForm.querySelector(`#f-${componentId}`)
     return component
   }
+
+  getComponents = address => {
+    const components = []
+    const componentId = address.slice(address.indexOf('.') + 1)
+
+    if (isExternalAddress(address)) {
+      components.push(this.external[componentId])
+    } else {
+      components.push(...this.renderedForm.querySelectorAll(`[name=f-${componentId}]`))
+    }
+
+    return components
+  }
 }
 
 const LISTEN_TYPE_MAP = component => {
   const typesMap = [
     ['input', c => ['textarea', 'text'].includes(c.type)],
-    ['change', c => ['select'].includes(c.tagName) || ['checkbox', 'radio'].includes(c.type)],
+    ['change', c => ['select'].includes(c.tagName.toLowerCase()) || ['checkbox', 'radio'].includes(c.type)],
   ]
 
   const [listenerEvent] = typesMap.find(typeMap => typeMap[1](component)) || [false]