fix(form): multiple selects return arrays for dirtycheck

lubber-de · web-flow · commit 182dd81520b2 · 2020-08-01T00:02:33.000+02:00
The fieldDirty check failed whenever a dropdown, converted from a select tag, was part of the form and was defined as multiple
The comparison of currentValue and initialValue failed for those dropdowns, because the .val() method returned arrays instead of strings for select-multiple fields. Dropdowns made out of div were working, because those use an input field, which holds a string.
Raw == comparisons of two arrays are never true, so that fiel was always considered dirty.
diff --git a/src/definitions/behaviors/form.js b/src/definitions/behaviors/form.js
@@ -366,9 +366,15 @@ $.fn.form = function(parameters) {
             var initialValue = $el.data(metadata.defaultValue);
             // Explicitly check for null/undefined here as value may be `false`, so ($el.data(dataInitialValue) || '') would not work
             if (initialValue == null) { initialValue = ''; }
+            else if(Array.isArray(initialValue)) {
+              initialValue = initialValue.toString();
+            }
             var currentValue = $el.val();
             if (currentValue == null) { currentValue = ''; }
-
+            // multiple select values are returned as arrays which are never equal, so do string conversion first
+            else if(Array.isArray(currentValue)) {
+              currentValue = currentValue.toString();
+            }
             // Boolean values can be encoded as "true/false" or "True/False" depending on underlying frameworks so we need a case insensitive comparison
             var boolRegex = /^(true|false)$/i;
             var isBoolValue = boolRegex.test(initialValue) && boolRegex.test(currentValue);
