title: typeahead.js: Uncaught TypeError: Cannot read property 'length' of null
body: <p>I looked through all the other <code>'length' of null</code> questions, but they didn't help me.</p>
  
  <p>I am on a <a href="https://www.youtube.com/watch?v=x4F6Kcbo3Vw" rel="nofollow noreferrer">YouTube</a> tutorial to implement autosuggest into a form using typeahead.js, but it isn't working. Chromes console puts out: </p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'length' of null
  </code></pre>
  
  <p>Could someone please help me and point out where I am wrong.</p>
  
  <p>Here the relevant html:</p>
  
  <pre><code>&lt;form action="index.php" method="get" autocomplete="off"&gt;
      &lt;input type="text" name="user" id="users"&gt;
      &lt;input type="submit" value="Go"&gt;
  &lt;/form&gt;
  
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/typeahead.js"&gt;&lt;/script&gt;
  &lt;script src="js/global.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>and the relevant js:</p>
  
  <pre><code>$(document).ready(function() {
      var users = new Bloodhound({
          datumTokenizer: Bloodhound.tokenizers.obj.whitespace('username'),
          queryTokenizer: Bloodhound.tokenizers.whitespace,
          remote: 'users.php?query=%QUERY'
      });
  
  users.initialize(); 
  
      $('#users').typeahead({
          hint: true,
          highlight: true,
          //minLength: 2          
      }, {
          name: 'users',
          displayKey: 'username',
          source: users.ttAdapter()   // what is ttAdapter() ?
      });
  });
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/mqZdx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mqZdx.png" alt="&quot;Uncaught TypeError&quot; in Chromes Console"></a></p>