POST para Twitter Typeahead

Estou aqui há 2 dias, tentando entender e ter uma imagem clara de como usar / gerenciar o typeahead.js 0.10 para usar dados locais, remotos e buscados.

Honestamente, o mecanismo bloodhound não está claro para mim e informações detalhadas sobre como manipular / acessar objetos e matrizes json ainda são um ponto de interrogação.

Posso fazer o exemplo local funcionar, mas sempre que tento usar as opções de pré-busca ou remota, além de vários ticks, não posso fazê-lo funcionar.

Meu objetivo neste post não é apenas obter uma resposta para o meu problema, mas encontrar alguém que tenha o conhecimento completo e que seja capaz de, de uma maneira muito simples, explicar passo a passo (com exemplos / jsfiddles - incluindo exemplos json, para saber o que realmente está sendo analisado) como isso funciona.

Eu acho que muita gente está ansiosa para entendê-lo e isso será uma grande contribuição (já que existem outros posts detalhados).

Eu imagino que isso é trabalho duro.

Agradecemos antecipadamente a seus colaboradores.

Seguindo a sugestão abaixo. Meu exemplo simples.

Arquivo JSON

   [
    {   "name": "Pink Floyd",
        "Album": "The Best Of Pink Floyd: A Foot In The Door",
        "Label": "EMI UK",
        "Tracks":"Hey You, See Emily Play, The Happiest Days Of Our Lives, Another Brick in The Wall (Part 2), Have a cigar, Wish You Where Here, Time, The Great Gig in the Sky, Money, Comfortably Numb, High Hopes, Learning to Fly, The Fletcher Memorial Home, Shine On You Crazy Diamond, Brain Damage, Eclipse" ,
        "Price": "16.40",
        "Genre": "Rock"

    },
    {
        "name": "Depeche Mode",
        "Album": "A Question Of Time",
        "Label": "Mute",
        "Tracks":"A Question Of Time, Black Celebration, Something To Do, Stripped, More Than A Party, A Question Of Time(extended), Black Celebration" ,
        "Price": "4.68" ,
        "Genre": "Rock"
    },
    {
        "name": "Placebo",
        "Album": "Street Halo/Kindred",
        "Label": "Hyperdub Japan",
        "Tracks":"Street Halo, NYC, Stolen Dog, Kindred, Loner, Ashtray Wasp" ,
        "Price": "14.06",
        "Genre": "Future Garage"

    }
  ]

Script de digitação antecipada

  <script>

  var products = new Bloodhound({
    datumTokenizer: function(d) {return d.name; },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    prefetch: 'http://localhost/dh/js/products.json'


  });


  products.initialize();

  $('.test1').typeahead({
    highlight: true
  },
  {
    name: 'products',
    displayKey: 'num',
    source: states.ttAdapter()

  });

  </script>

HTML

   <script type="text/javascript" src="http://localhost/dh/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://localhost/dh/js/bootstrap.js"></script>
<script type="text/javascript" src="http://localhost/dh/js/typeahead.bundle.js"></script>

<div class="search_content">
    <input class="test1" type="text" placeholder="product">
</div>