MVC3 и JQuery - Может ли метод jQuery ajax отображать изображение, сгенерированное в контроллере? - PullRequest
1 голос
/ 26 сентября 2011

Можно ли использовать ajax-метод JQuery для передачи параметров в контроллер, чтобы действие в контроллере возвращало изображение и отображало это изображение пользователю?

$.ajax({
    type: 'POST',
    url: '/Controller/Action',
    data: { 'parameter1': '\'' + parameter1Value + '\'', 'parameter2': '\'' + parameter1Value + '\'', 'parameter3': '\'' + parameter1Value },
    dataType: 'image' /* Can ajax return an image? */,
    success: function (imageResults) {
        // Do something
    },
    error: function (xhr, status, error) {
        // Do something else
    }
}

Моя цель - создать динамическое изображение на основе параметров формы и отобразить его обратно пользователю. Кроме того, дополнительным бонусом для рекламы будет запускать обработку ajaxstart и ajaxstop, используемую другими вызовами ajax на странице.

1 Ответ

1 голос
/ 27 сентября 2011

Не выполняйте действия контроллера AJAX, которые возвращают изображения, файлы или что-то еще.Гораздо более простым решением является следующее:

$('body').append(
    $('<img/>', {
        src: '@Url.Action("Action", "Controller")?parameter1=' + encodeURIComponent(parameter1Value) + '&parameter2=' + encodeURIComponent(parameter2Value),
        alt: 'some image'
    })
);

Это просто динамически внедряет следующий тег <img> в конец <body> (вы, конечно, можете адаптировать местоположение, если вам не нравитсяbody):

<img src="/Controller/Action/?parameter1=foo&parameter2=bar" alt="some image" />

Все остальное сделает браузер.Просто убедитесь, что действие контроллера возвращает File результат.

Также, если эти изображения генерируются динамически каждый раз, IE может вызывать определенные PITA, поскольку он может их кэшировать.Чтобы уничтожить кеш, добавьте случайную метку времени к URL:

$('body').append(
    $('<img/>', {
        src: '@Url.Action("Action", "Controller")?parameter1=' + encodeURIComponent(parameter1Value) + '&parameter2=' + encodeURIComponent(parameter2Value) + '&cacheBuster=' + encodeURIComponent((new Date()).getTime()),
        alt: 'some image'
    })
);
...