title: Cannot make Typeahead bloodhound to work
body: <p>I am using twitter typeahead.js for the first time. I first started with a simple local array and I get it to work.</p>
  
  <p>As a next step, I am now trying to make it work with a .json file. Though I tried several options I cannot make it to work and part of it is because I don't understand very well how bloodhound works.</p>
  
  <p>HTML code</p>
  
  <pre><code>&lt;div class="search_content"&gt;
    &lt;input class="products" type="text" placeholder="products" value=""&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JSON file (part of it)</p>
  
  <pre><code>{
      "Products": [
          {   "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"
          }
  
      ]
  }
  </code></pre>
  
  <p>Typeahead.js Code</p>
  
  <pre><code>var products = new Bloodhound({
      datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.name); },
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      prefetch: '/js/products.json'
  
  });
  
  products.initialize();
  
  $('.products').typeahead(null, {
      name: 'products',
      displayKey: 'name',
      source: products.ttAdapter()
  });
  </code></pre>