fix update of value from autocomplete, #1557

src/public/app/services/attribute_autocomplete.js

@@ -40,44 +40,49 @@ function initAttributeNameAutocomplete({ $el, attributeType, open }) {
 }
 
 async function initLabelValueAutocomplete({ $el, open, nameCallback }) {
-    if (!$el.hasClass("aa-input")) {
+    if ($el.hasClass("aa-input")) {
-        const attributeName = nameCallback();
+        // we reinit everytime because autocomplete seems to have a bug where it retains state from last
-
+        // open even though the value was resetted
-        if (attributeName.trim() === "") {
+        $el.autocomplete('destroy');
-            return;
-        }
-
-        const attributeValues = (await server.get('attributes/values/' + encodeURIComponent(attributeName)))
-            .map(attribute => ({ value: attribute }));
-
-        if (attributeValues.length === 0) {
-            return;
-        }
-
-        $el.autocomplete({
-            appendTo: document.querySelector('body'),
-            hint: false,
-            openOnFocus: true,
-            minLength: 0,
-            tabAutocomplete: false
-        }, [{
-            displayKey: 'value',
-            source: function (term, cb) {
-                term = term.toLowerCase();
-
-                const filtered = attributeValues.filter(attr => attr.value.toLowerCase().includes(term));
-
-                cb(filtered);
-            }
-        }]);
-
-        $el.on('autocomplete:opened', () => {
-            if ($el.attr("readonly")) {
-                $el.autocomplete('close');
-            }
-        })
     }
 
+    const attributeName = nameCallback();
+
+    if (attributeName.trim() === "") {
+        return;
+    }
+
+    const attributeValues = (await server.get('attributes/values/' + encodeURIComponent(attributeName)))
+        .map(attribute => ({ value: attribute }));
+
+    if (attributeValues.length === 0) {
+        return;
+    }
+
+    $el.autocomplete({
+        appendTo: document.querySelector('body'),
+        hint: false,
+        openOnFocus: false, // handled manually
+        minLength: 0,
+        tabAutocomplete: false
+    }, [{
+        displayKey: 'value',
+        cache: false,
+        source: async function (term, cb) {
+            term = term.toLowerCase();
+
+            const filtered = attributeValues.filter(attr => attr.value.toLowerCase().includes(term));
+
+            cb(filtered);
+        }
+    }]);
+
+    $el.on('autocomplete:opened', () => {
+        if ($el.attr("readonly")) {
+            $el.autocomplete('close');
+        }
+    });
+
     if (open) {
         $el.autocomplete("open");
     }

src/public/app/services/split.js

@@ -24,8 +24,6 @@ function setupSplit(left, right) {
         rightPaneWidth = 5;
     }
 
-    console.log(leftPaneWidth, rightPaneWidth);
-
     if (left && right) {
         instance = Split(['#left-pane', '#center-pane', '#right-pane'], {
             sizes: [leftPaneWidth, 100 - leftPaneWidth - rightPaneWidth, rightPaneWidth],

src/public/app/widgets/attribute_detail.js

@@ -248,6 +248,8 @@ export default class AttributeDetailWidget extends TabAwareWidget {
         this.$rowValue = this.$widget.find('.attr-row-value');
         this.$inputValue = this.$widget.find('.attr-input-value');
         this.$inputValue.on('keyup', () => this.userEditedAttribute());
+        this.$inputValue.on('change', () => this.userEditedAttribute());
+        this.$inputValue.on('autocomplete:closed', () => this.userEditedAttribute());
         this.$inputValue.on('focus', () => {
             attributeAutocompleteService.initLabelValueAutocomplete({
                 $el: this.$inputValue,