防止对空格的aaax调用typeahead.js

Question

我一直在使用typeahead.js并使用BloodHound remote选项加载数据。

Everthing正在按预期工作，除了当我在only spaces中输入textbox时，仍然需要sends ajax call。

我想知道如果在文本框中有prevent ajax call，是否有办法到only spaces。我正在寻找类似trim的行为。

这是我的代码。我试图使用prepare功能，但没有运气。

var dataSource = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('ProductID', 'ProductName'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
              url: urlVar + "LoadAllProductByProductName/%QUERY",
              wildcard: '%QUERY',

            },
    sufficient: 3,
   });

const $tagsInput = $('.txtProductName')
$tagsInput.typeahead({
   minLength: 3,
   source: dataSource,
   hint: false,
   highlight: true,
   isBlankString: false
   },
   {
      limit: 10,
      source: dataSource,
      name: 'dataSource',
      display: function (item) {
         return item.ProductName
      },
      suggestion: function (data) {
         return '<div>' + data.ProductName + '–' + data.ProductID + '</div>'
      },

});

Answer 1

我会尝试将keyUp事件附加到文本框以执行过滤：

$tagsInput.keyup(function(){
        this.value = this.value.replace(/  */, ' ');
    });

这将在第二个空格之后触发，除非字段中还有非空格字符，否则应该缓解不期望的行为。

Answer 2

remote属性有一个prepare函数，您可以在调用电话之前使用此更改的句柄。

举个例子：

function createBloodHoundConfig(options) {
    return {
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('Name'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        identify: options.identify,
        sufficient: 8,
        remote: {
            url: options.url,
            prepare: function (query, settings) {
                settings.url = settings.url.replace("{q}", query.trim());
                return settings;
            }
        },
    };
}

请注意，在这种情况下，您不提供wildcard属性，因为它实际上是进行令牌替换的简写。