ayanova/src/components/pick-list.vue

@@ -130,16 +130,34 @@ export default {
       if (!val || vm.searchUnderway) {
         return;
       }
-
-      //console.log("watch::searchEntry,val=", val);
       if (vm.selected != null) {
         if (val == vm.selected.name) {
           return;
         }
       }
+      //doSearch(vm, val);
+      //window.$gz._.debounce(doSearch(vm, val), 1300);
+      //debounce and don't search constantly on every keystroke
+      console.log("Calling debounced test...");
+      this.test();
+    },
+    value(val) {
+      //this ensures the parent form gets the onchange event
+      //not actually sure why there are two here but it worked with the datetime picker so I replicated it here
+      //To answer above it appears both are necessary for proper operation
+      this.$emit("input", val);
+      this.$emit("change", val);
+    }
+  },
 
+  methods: {
+    lt: function(ltkey) {
+      return window.$gz.translation.get(ltkey);
+    },
+    doSearch: window.$gz._.debounce(function() {
+      //-----------------
       //Pre-process the query to validate and send conditionally
-
+      var val = this.searchEntry;
       //get the discrete search terms and verify there are max two
       var isATwoTermQuery = false;
       var queryTerms = [];
@@ -234,20 +252,9 @@ export default {
         .catch(err => {
           window.$gz.errorHandler.handleFormError(err);
         });
-    },
-    value(val) {
-      //this ensures the parent form gets the onchange event
-      //not actually sure why there are two here but it worked with the datetime picker so I replicated it here
-      //To answer above it appears both are necessary for proper operation
-      this.$emit("input", val);
-      this.$emit("change", val);
-    }
-  },
 
-  methods: {
-    lt: function(ltkey) {
-      return window.$gz.translation.get(ltkey);
-    }
+      //------------
+    }, 1300)
   },
   beforeCreate() {
     //check pre-requisites exist just in case