MVC 3 & JQuery - ajaxStop или ajaxComplete не запускается

Question

Может показаться, что ajaxStart в моем проекте MVC 3 работает, но не ajaxStop или ajaxComplete. Проблема не зависит от браузера, так как я проверял это в IE9, Mozilla и Chrome.

Мой проект просто берет серию букв и находит комбинации / перестановки и показывает их пользователю. Инициируется функция ajax, запускается ajaxStart и появляется индикатор «Пожалуйста, подождите». Когда вызов ajax завершен (я бы предположил), таблица заполняется, но ajaxStop / ajaxComplete никогда не запускается, и индикатор «пожалуйста, подождите» никогда не исчезает.

Вот JavaScript, который я использую:

$(document).ready(function () {
    $(document).ajaxStart(function () {
        $('#ajaxBackground').show();
        $('#ajaxProgress').show();
    });

    $(document).ajaxStop(function () {
        $('#ajaxBackground').hide();
        $('#ajaxProgress').hide();
    });

    $('#submit').click(function () {
        var p = $('#prefix').val();
        var l = $('#letters').val();
        var s = $('#suffix').val();

        $.ajax({
            url: '@Url.Action("Search", "Home")',
            type: 'POST',
            dataType: 'json',
            data: { prefix: p, letters: l, suffix: s },
            success: function (jsonresults) {
                $('#searchResults').find('tr').remove().end();
                for (var i = 0; i <= jsonresults.length; i++) {
                    $('#searchResults').append('<tr><td>' + jsonresults[i].word + '</td><td>' + jsonresults[i].length + '</td><td>' + jsonresults[i].score + '</td></tr>');
                }
            },
            error: function () {
                alert('error');
            }
        });
    });
});

Я что-то пропустил? Любая помощь будет принята с благодарностью. Спасибо.

Answer 1

Обычно это должно работать. Я подозреваю, что ваш #submit является либо кнопкой отправки формы, либо якорем. Вы подписались на событие click этого элемента, где вы запускаете запрос AJAX. Но вы не отменяете действие по умолчанию для этого элемента, потому что вы не return false в конце своей функции. Таким образом, ваш AJAX-запрос запускается, а затем браузер перенаправляется и не успевает завершить обработку этого AJAX-запроса.

Поэтому попробуйте вернуть false сразу после функции $.ajax.