Typeahead.js 프리 페치 동적 PHP는 내 코드는, JSON

Question

에게 내 autosuggestions에 대한 Typeahead.js을 사용하고

생성 내 JSON에 tokens을 사용하고 Bloodhound의 토큰을 기반으로 결과를 반환 할 수 있습니다.

DB에 항상 제안 항목이 추가되어 정적 JSON을 간단하게 만들 수는 없습니다.

json을 동적으로 프리 페치 할 수있는 방법이 있습니까?

Answer 1

나는 prefetch을 사용하여 Typeahead의 예를 작성했습니다. 이 예는 원격 소스에서 JSON 데이터를 검색 다음과 같이

http://jsfiddle.net/Fresh/1hrk0qso/

원격 소스에서 JSON을 프리 페치, 블러드 하운드 객체 ​​구현 :

var countries = new Bloodhound({ 
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
queryTokenizer: Bloodhound.tokenizers.whitespace, 
prefetch: { 
url: 'https://cdn.rawgit.com/twitter/typeahead.js/gh-pages/data/countries.json', 
    filter: function (countries) { 
     return $.map(countries, function (country) { 
      return { 
       name: country 
      }; 
     }); 
    } 
} 
}); 

당신은 URL을 대체합니다 동적으로 생성 된 JSON을 반환하는 URL로 위의 코드에 표시된 정적 JSON 파일

여기의 키 코드는 평면 JSON 토큰을 Typeahead가 작동해야하는 Javascript 객체 배열에 매핑하는 "필터"기능입니다.

Answer 2

"더 작은 데이터 세트로 도출 할 수 있지만 프리 페치 된 데이터는 전체 데이터 세트를 포함하는 것이 아니라 오히려 제안을위한 1 차 레벨 캐시로 작동해야합니다. 이 경고를 염두에 두지 않으면 로컬 저장 용량 한도에 도달 할 위험이 있습니다. "

https://github.com/twitter/typeahead.js/blob/master/doc/bloodhound.md#prefetch

당신이 검색하는 데이터의 양 모르지만 데이터를 얻을 다음은 응답을받을 때 블러드 하운드 인스턴스로 그를로드 할 아약스 전화를 걸 더 좋을 수 있습니다. 이 도움이

//Let's assume that the data you get back from the server is an array of objects 
//data = [{value: 'a'}, {value: 'b'}, {value: 'c'}]; 

$.get("http://example.com/your-data", function(data) { 
    var bh = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    local: data 
    }); 

    var dataset = { 
    name: "My-dataset-name", 
    displayKey: "value", 
    source: bh.ttAdapter() 
    }; 

    var ta = $(".typeahead").eq(0).typeahead(
    { 
     hint: true 
     highlight: true 
     minLength: 1 
    }, 
    datasetStates 
    ); 
    ta.on('typeahead:selected', someFunctionToHandleEvent); 
}); 

희망 :

는 여기에 jQuery를 아약스 호출을 사용하여 예입니다.