I have a MVC website and it had a searchbox with autocomplete, now I changed the layout using bootstrap. But now the autocomplete isn't been shown correctly anymore. See the picture the suggestions are not shown right.

the autocomplete goes through the text. I was fine before I used bootstrap.

I am using a SQL server to get the data and this is js file (I'm not good at ajax, i took it from a tutorial I followed)

$(function () {

var ajaxFormSubmit = function () {


    var $form = $(this);

    var options = {
        url: $form.attr("action"),
        type: $form.attr("method"),
        data: $form.serialize()
    };

    $.ajax(options).done(function (data) {
        var $target = $($form.attr("data-aptitude-target"));
        var $newHtml = $(data);
        $target.replaceWith($newHtml);
        $newHtml.show("slide", 200);
    });

    return false;
};

var submitAutocompleteForm = function (event, ui) {

    var $input = $(this);
    $input.val(ui.item.label);

    var $form = $input.parents("form:first");
    $form.submit();
};

var createAutocomplete = function () {
    var $input = $(this);

    var options = {
        source: $input.attr("data-aptitude-autocomplete"),
        select: submitAutocompleteForm
    };

    $input.autocomplete(options);
};

$("form[data-aptituder-ajax='true']").submit(ajaxFormSubmit);
$("input[data-aptitude-autocomplete]").each(createAutocomplete);


});

this is the form in my view

<form method="get" action="@Url.Action("Index")"
  data-aptitude-ajax="true" data-aptitude-target="#testList">
<input type="search" name="searchTerm" data-aptitude-autocomplete="@Url.Action("Autocomplete")" />
<input type="submit" value=Search />

And this is part of the controller of the view

    public ActionResult Autocomplete(string term)
    {

        var model = db.tests
           .Where(r => term == null || r.name.Contains(term))
            .Select(r => new
            {
                label = r.name
            });

        return Json(model, JsonRequestBehavior.AllowGet);
    }


    //
    // GET: /Test/
    public ActionResult Index(string searchTerm = null)
    {
        var model = db.tests
           .Where(r => searchTerm == null || r.name.StartsWith(searchTerm));

       if (Request.IsAjaxRequest())
        {
            return PartialView("_Test", model);
        }

        return View(model);
    }

I'm new to ajax as well as bootstrap 3. I got the searchfunction and autocomplete from a tutorial I followed. Anybody any idea on how to fix this, because it worked fine?

Thanks in advance!