title: How to close Kendo UI Autocomplete programmatically
body: <p>I am using the Kendo UI Autocomplete Box in a ASP.Net MVC Application.
  (KENDO UI for ASP.NET MVC Q1 2016)</p>
  
  <p>The part of the .cshtml code looks like this:</p>
  
  <pre><code> &lt;div class="row"&gt;
          &lt;div class="col-md-10"&gt;
              &lt;div class="form-group"&gt;
                  @Html.Label(Strings.ManagerTimeEffortFormPartial_LabelLookupCustomer, new { @class = "k-label" })
                  @Html.TextBox("CustomerId", "", new { style = "display: none;" })
                  @(Html.Kendo().AutoComplete()
                  .Name("CustomerName")
                  .DataTextField("DisplayName")
                  .Filter(FilterType.Contains)
                  .MinLength(3)
                  .DataSource(source =&gt;
                  {
                      source.Read(read =&gt;
                      {
                          read.Action("SearchCustomers", "Customer")
                              .Data("onSearchManagerEffortCustomerName");
                      })
                      .ServerFiltering(true);
                  })
                  .HtmlAttributes(new { @class = "k-textbox-fullwidth" })
                  .Events(e =&gt;
                  {
                      e.Select("onSelectManagerEffortCustomer");
  
                  })
                  )
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>The element needs to be prefilled with a value. I am doing this after the ui was loaded: </p>
  
  <pre><code>   $(function () {
  
      var customerValue = $("#Project_CustomerName").val();
  
      var customerNameAutoComplete = $("#CustomerName").data("kendoAutoComplete");
      $("#CustomerName").val(customerValue);
  
      customerNameAutoComplete.search(customerValue);     
  
      customerNameAutoComplete.select(customerNameAutoComplete.ul.children().eq(0));
     customerNameAutoComplete.close();
  
  
  });
  </code></pre>
  
  <p>Calling the "Close" method should close the suggestions (from what I understood in the <a href="http://docs.telerik.com/kendo-ui/api/javascript/ui/autocomplete#methods-close" rel="nofollow">documentation</a>) but it does not work (the suggestions are still open). If I scroll the window in the ui or click somewhere else it closes immediately, but setting focus programmatically to another element or triggering a click-event via code doesn't help. I could hide/change the DOM-elements one by one, but I don't think this is a good solution, there are too many attributes changing when the item is selected with a mouse click.</p>
  
  <p>Everything else in the code works fine (binding source, selecting the element and so on - I did not post the JS-Code for these parts here). I also tried to play with the "suggest" method without any luck. Any idea or a hint in the right direction?</p>
  
  <p>This is how the autocomplete looks like after calling the "Close" method (still open):
  <a href="http://i.stack.imgur.com/pJuuV.png" rel="nofollow">Screenshot of Autocomplete Box with open suggestions</a></p>