5

先行入力のために人の名前のオートコンプリート情報を読み込もうとしていますが、結果が既にある場合はサーバーに再度クエリを実行する必要はありません。

たとえば、人の名前を検索し、その人のデータ (とりわけ) がリモート クエリから取得された場合、名前を削除して姓を検索すると、代わりにその姓の以前にキャッシュされた名前が表示されるようにする必要があります。 . 実際には、サーバーから結果が再度取得され、提案されます。

キャッシュは、単一の単語を入力している間のみ機能します ("Mic" -> "Mich" -> "Micha" -> "Michael")。

TL;DR: ブラッドハウンドの結果を、プリフェッチ (私の状況には適用できません) だけでなく、リモートからもローカル ストレージにキャッシュし、それを使用してリモートに再度クエリを実行したいと考えています。

私が現在持っているのは

function dispkey(suggestion_object){
  console.log(suggestion_object);
  return suggestion_object["lastname"] + ", " + suggestion_object["firstname"];
}

var engine = new Bloodhound({
  name: 'authors',
  local: [],
  remote: 'http://xxxxxx.xxx/xxxx/xxxxxxxxxx?query=%%QUERY',
  datumTokenizer: function(d) {
    return Bloodhound.tokenizers.whitespace(d.val);
  },
  queryTokenizer: function (s){
    return s.split(/[ ,]+/);
  },
});

engine.initialize();

$('.typeahead').typeahead({
    highlight: true,
    hint: true,
    minLength: 3,
},
{
  displayKey: dispkey,
  templates: {
     suggestion: Handlebars.compile([
      '<p id="author_autocomplete_email_field" >{{email}}</p>',
      '<p id="author_autocomplete_name_field">{{lastname}} {{firstname}}</p>',
      ].join(''))},
  source: engine.ttAdapter(),
});

私は似たようなものを見つけていません。これには簡単な解決策がないのではないかと心配しています。

PS: datumTokenizer が呼び出されないことにも気付きました

datumTokenizer: function(d) {
    console.log("Lalalalala");
    return Bloodhound.tokenizers.whitespace(d.val);
  },

これを使用したところ、chromeデバッグコンソールに「Lalalalala」が出力されることはありませんでした。

4

1 に答える 1

3

jhardingが述べたように、この時点でリモートの提案を引き出すことはできませんlocalstorage

しかし、私は最近、typehead.js で将来使用するために以前のフォーム入力を保存する必要がある小さなプロジェクトに取り組みました。これを行うために、フォーム入力値の配列を に保存しましたlocalstorage

var inputs = ['val1', 'val2', 'val3', 'val4'];
localStorage.setItem('values', JSON.stringify(inputs));

次に、typeahead フィールドで使用する配列を取得しました。

var data = JSON.parse(localStorage.getItem('values'));
$('input').typeahead({
    minLength: 3,
    highlight: true,
},
{
    name: 'data',
    displayKey: 'value',
    source: this.substringMatcher(data)
});

ここで私の完全なソースを表示できます。

于 2015-01-04T20:23:49.693 に答える