title: Jquery autocomplete suggestion is not showing under textbox and showing at the bottom of the page in ASP.NET MVC
body: <p>I have a textbox in ASP.Net MVC application at top of my Home page.</p>
  
  <pre><code>    @Html.TextBox("place", Model.place,Model.place, new {id="place", @class = "form-control", @placeholder = "Search by Location" })
  </code></pre>
  
  <p>I am using Jquery to get suggestions:</p>
  
  <pre><code>     $(document).ready(function () {
      $("#place").autocomplete({
          source: function (request, response) {
              $.ajax({
                  url: "/Search/AutoCompleteSearch",
                  type: "POST",
                  dataType: "json",
                  data: { term: request.term },
                  success: function (data) {
                      response($.map(data, function (item) {
                          return { label: item.SearchTerm, value: item.SearchTerm };
                      }))
  
                  }
              })
          },
          messages: {
              noResults: "", results: ""
          }
      });
  })
  </code></pre>
  
  <p>In my controller i have written the following code:</p>
  
  <pre><code>     public JsonResult AutoCompleteSearch(string term)
      {
          var searchResults = frequentsearchtermService.GetTerms(term);
          return Json(searchResults, JsonRequestBehavior.AllowGet);
      }
  </code></pre>
  
  <p>While executing my application it is showing suggestions, but instead of just below the text box, it shows after the footer of my page.</p>