Событие Select в автозаполнении JQuery UI не запущено

Question

Я пытаюсь использовать пользовательский интерфейс jQuery, но не могу понять, как заставить событие select выполнить.

Я связываю автозаполнение следующим образом:

$().ready(function () {
    $("#txtPersonSearch").autocomplete({
        source: '<%=Url.Action("GetPeople") %>',
        minLength: 3,
        select: function (event, ui) {
            // This code is never reached
            console.log(ui);
        }
    });
});

Я что-то упустил, чтобы можно было привязать к событию select?

Answer 1

Возможно, действие вашего контроллера вызывает исключение. Давайте предпримем следующее действие:

public ActionResult GetPeople(string term)
{
    // the term parameter will contain the search string
    // TODO: use the term parameter to filter the results from 
    // your repository. In this example the result is hardcoded
    // to verify that the everything works.
    return Json(new[]
    {
        new { id = "1", label = "label 1", value = "value 1" },
        new { id = "2", label = "label 2", value = "value 2" },
        new { id = "3", label = "label 3", value = "value 3" },
    }, JsonRequestBehavior.AllowGet);
}

На что нужно обратить внимание:

• Действие контроллера доступно с глаголом GET (JsonRequestBehavior.AllowGet)
• Действие контроллера возвращает массив JSON, в котором каждый элемент имеет свойства id, label и value
• Действие контроллера не вызывает исключение

А потом:

$(function () {
    $('#txtMovieSearch').autocomplete({
        source: '<%= Url.Action("GetPeople") %>',
        minLength: 3,
        select: function (evt, ui) {
            console.log(ui);
        }
    });
});

И, наконец, используйте FireBug для анализа того, что именно отправляется на ваш сервер в виде AJAX-запроса и ответа от сервера.