Twitter的typeahead-bloodhound：使用ajax.data和POST時，「％QUERY」的等效含義是什麼？

Question

如果一個使用警犬用GET：

// Typeahead 
personsBloodhound = new Bloodhound({ 
    datumTokenizer: function (person) { return person.name; }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
     url: '/ajax/Persons/List?nameContains=%QUERY', 
     ajax: { 
      beforeSend: function(xhr) { 
       $(".searching-person").show(); 
      }, 
      data: { 
       "pageSize": 4, 
       "otherParam1": "blah", 
       "otherParam2": "bleh", 
      } 
     }, 
     filter: function (response) { 
      $(".searching-person").hide(); 
      return response.persons; 
     } 
    } 
}); 

一個簡單的使用QUERY％的URL。

現在....
如果一個使用警犬用POST，我應該怎麼用的，而不是％查詢？

// Typeahead 
personsBloodhound = new Bloodhound({ 
    datumTokenizer: function (person) { return person.name; }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
     url: '/ajax/Persons/List', 
     ajax: { 
      type: "POST", 
      beforeSend: function(xhr) { 
       $(".searching-person").show(); 
      }, 
      data: { 
       "nameContains": ....WHAT GOES HERE?????...... 
       "pageSize": 4, 
       "otherParam1": "blah", 
       "otherParam2": "bleh", 
      } 
     }, 
     filter: function (response) { 
      $(".searching-person").hide(); 
      return response.persons; 
     } 
    } 
}); 

如果它是不明確的，問題是：
什麼是%QUERY使用POST當等效警犬的遙控器內？

的文檔不明確這一點，（證明）： https://github.com/twitter/typeahead.js/blob/master/doc/bloodhound.md#remote

使用也試過：

"nameContains": $("#my-input-that-uses-typeahead").val(), 

但沒有奏效。

Answer 1

你必須以某種方式改變URL，否則不會獵犬發送其他要求（見https://stackoverflow.com/a/24025789/2175370）和實況搜索/預輸入無法工作。

所以("#my-input-that-uses-typeahead").val()在動態網址（例如http://127.0.0.1:1234/REST_API/_search?useless=%QUERY）和beforeSend-功能在ajax設置中正常工作。

我要提出有關此行爲的問題。使用獵犬的POST請求是非常尷尬的，並帶走了typeahead.js打算的簡單。

編輯：

還要確保您爲數據的新值beforeSend並設置settings.hasContent = true。 否則將使用初始數據。

示例如何完成：https://github.com/twitter/typeahead.js/issues/542#issuecomment-29995960。

Answer 2

正確的是，在進一步看待血腥獵狗之後，通配符就是取代價值的東西。

它不存儲查詢字符串的任何地方。對queryChanged火災和過濾器的遠程響應。看起來你必須自己得到查詢。

"nameContains": $('input#search').val() 

Answer 3

當在Bloodhound的遙控器內使用POST時%QUERY的等同物是query。

下面是一個簡單的例子（有詳細的解釋），您可以在GET和POST之間使用它。正如你所看到的，我已經聲明瞭一個變量isExtendUrl。如果這設置爲true，那麼查詢（你輸入的內容）將被添加到URL的末尾（你必須以某種方式給myurl）。

下一個變量是isRequestMethod。如果設置爲POST，則可以使用呼叫POST的呼叫，否則您可以將其用於呼叫GET。正如你所見，prepare函數有兩個參數query和setting。 query是你輸入的那個。如果你只是想POST呼叫沒有GET移動prepare鍵值對內remote對象。

因此，如果您必須使用JSON機身作爲{gender: 'MALE', name: 'what is typed'}爲您的POST調用。您可以擁有包含所有鍵值對的初始查詢對象，例如：initialQuery = {gender: 'MALE'}和搜索時應添加到initialQuery的密鑰searchKey，可以在prepare上添加，如initialQuery[searchKey] = query。

最後，如果您的POST調用的響應對象是一個對象，並且您必須提取特定的鍵值，請使用filter。例如，假設您的響應對象

{ 
    status: 'some status', 
    content: [{array}, {of}, {objects}, ...], 
    someKey: someValue 
} 

，你必須得到content，然後返回data.content。這裏是一個完整的例子

let isExtendUrl = true; //to add query at the end of the url, usually used with GET 
let isRequestMethod = 'POST'; 
let initialQuery = {gender: 'MALE'}; 
let searchKey = 'name'; 

let bloodhound = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.whitespace, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 

    remote: { 
     url: isExtendUrl ? myurl + '%QUERY' : myurl, 
     wildcard: '%QUERY', 
     filter: function (data) { 
      return $.map(data.content, function (obj) { 
       return obj; 
      }); 
     } 
    } 
}); 

if (isRequestMethod == 'POST') { 
    let prepare = function (query, settings) { 
     initialQuery[searchKey] = query; 
     settings.type = "POST"; 
     settings.contentType = "application/json; charset=UTF-8"; 
     settings.data = JSON.stringify(initialQuery); 

     return settings; 
    } 
    bloodhound.remote.prepare = prepare; 
}