title: twitter bootstrap 2.2.2 typeahead simple builtin function data source not working
body: <p>I'm trying to work with bootstrap 2.2.2 typeahead which as per the documentation can be configured to some function for its Source option. </p>
  
  <pre><code>    $('#test').typeahead({           
          source: function (query, process) {
              return $.get('@Url.Action("Search")', { query: query }, function (data) {
                  return process(data);
              });
          }
      });
  </code></pre>
  
  <p>this is what I'm trying. </p>
  
  <p>my server side has simple action </p>
  
  <pre><code>    public ActionResult Search(string query)
      {
          var teamMembers = new List&lt;String&gt;();
          for (int i = 1; i &lt; 21; i++)
          {
              var teammember = "john doe + ( " + i +" )";                                    
              teamMembers.Add(teammember);
          };
  
          return new JsonResult()
          {
              Data = teamMembers.ToArray(),
              JsonRequestBehavior = JsonRequestBehavior.AllowGet
          };
      }
  </code></pre>
  
  <p>It can't get any simpler than this but my "Search" action doesn't get hit at all. If anybody can guide me what I'm doing wrong and how can TypeAhead invoke controller Action precisely by Source being set by some async. function using bootstrape 2.2.2 native component only. Do let me know if any clarification is required.</p>
  
  <p>Static data working just fine so apparently there is no file that I'm missing here. as you can also see in the markup below. </p>
  
  <pre><code>    &lt;input type="text" data-provide="typeahead"                                 
              data-source='["Deluxe Bicycle", "Super Deluxe Trampoline", "Super Duper Scooter"]'&gt;
  </code></pre>
  
  <p>P.S pls don't mention any typeahead fork out there i'm only interested to know about twitter bootstrap 2.2.2 native typeAhead functionality. </p>
  
  <p><strong>UPDATED: FULL CODE</strong>
  HomeController</p>
  
  <pre><code>    public class HomeController : Controller
      {
      public ActionResult Index()
      {
          return View();
      }        
  
      public ActionResult TypeAhead(string query)
      {
          var teamMembers = new List&lt;String&gt;();
          for (int i = 1; i &lt; 21; i++)
          {
              var teammember = "john doe + ( " + i +" )";                                    
              teamMembers.Add(teammember);
          };
  
          return new JsonResult()
          {
              Data = teamMembers.ToArray(),
              JsonRequestBehavior = JsonRequestBehavior.AllowGet
          };
      }        
  }
  </code></pre>
  
  <p>My current view markup. </p>
  
  <pre><code>    &lt;script src="~/Scripts/jquery-1.7.1.js"&gt;&lt;/script&gt;
      &lt;script src="~/Scripts/bootstrap.js"&gt;&lt;/script&gt;
      &lt;link href="~/Content/bootstrap.css" rel="stylesheet" /&gt;
  
      &lt;script type="text/javascript"&gt;
  
        $(document).ready(function() {
  
            $('#testSearch').typeahead({
                source: function (query, process) {
                    $.get('@Url.Action("TypeAhead")', { query: query }, function(data) {
                       process(data);
                    });
                 }
            });        
        });
  
      &lt;/script&gt;
  
  
      &lt;ol class="round"&gt;               
        &lt;li class="three"&gt;
          &lt;input id="testSearch" data-provide="typeahead" &gt;
       &lt;/li&gt;        
     &lt;/ol&gt;
  </code></pre>