Загрузить файл, используя плагин формы Jquery

Question

Я использую Плагин формы Jquery для загрузки файла в запросе Ajax. Файл успешно отправлен на сервер, но в ответ браузер запрашивает сохранение ответа со следующим всплывающим окном

Вот мой HTML

<form:form name="newRequestForm" id="newRequestForm" modelAttribute="requestForm" method="POST">     
<form:input path="mrnFile" type="file" size="40"/>
</form:form>  

JS

    // Initializing Jquery form 
     $(function() {
        $('#newRequestForm').ajaxForm();   
    });

   // This function is called on click event of submit button  
function submitDataRequest(formAction) {
    var options = { 
            beforeSubmit: showRequest,  // pre-submit callback 
                success: showResponse,  // post-submit callback 
                url:  formAction,
                dataType:  'json'
            }; 
     $('#newRequestForm').ajaxSubmit(options); 
}   


function showRequest(formData, jqForm, options) { 
    alert('About to submit: '); 
    return true; 
} 

function showResponse(data, statusText, xhr, $form)  { 
    Alert("In response..")
    if (!data.actionPassed) {
        showErrors(data.errors);
        $("#hideOrShowErrors").show();  
    } else {
        showConfirmation(data, confirmationMsg, formName, successFormAction);
    }
} 

showResponse никогда не вызывается, вместо этого браузер показывает всплывающее окно.Я проверил через Firebug, код ответа - 200, все равно успешный обратный вызов не выполняется.После прочтения некоторого подобного вопроса я думаю, что это как-то связано с типом ответа сервера.Итак, я выполнил следующее в моем контроллере пружины

public ResponseEntity<ResponseDTO> save(@ModelAttribute("dataRequestForm") DataRequestFormDTO dataRequestFormDTO, BindingResult result, SessionStatus status, Model model, HttpServletResponse response) {  
HttpHeaders responseHeaders = new HttpHeaders();
        responseHeaders.setContentType(MediaType.APPLICATION_JSON);
        return new ResponseEntity<ResponseDTO>(responseDTO, responseHeaders, HttpStatus.CREATED);
    }   

С обеих сторон у меня есть тип данных json, но я все еще получаю всплывающее окно. Я делаю какую-то ошибку?

Спасибо!

---

РЕДАКТИРОВАТЬ:

Обновлен JS

function submitDataRequest(formAction) {
     var options = { 

                  beforeSubmit: function(){ 
                  alert("Before submit");
                  },  // pre-submit callback 
                    success: function(){
                    alert("On success");
                    },  // post-submit callback 
                    url:  formAction
    }  
         $('#newRequestForm').ajaxSubmit(options); 
 }

Тем не менее я получаю то же всплывающее окно и success обратный вызов не сработал.

Добавлено initBinder в контроллере

@InitBinder
    protected void initBinder(HttpServletRequest request,
            ServletRequestDataBinder binder) throws ServletException {
        binder.registerCustomEditor(CommonsMultipartFile.class,
                new ByteArrayMultipartFileEditor());    
    }   

После добавления initBinder я получил следующую ошибку

No serializer found for class java.io.ByteArrayInputStream and no properties discovered to create BeanSerializer

Answer 1

Это общая проблема с IE и iframe (используется плагином jquery form для загрузки файлов с помощью ajax).

Я решил в два этапа:

1) Сторона сервера: удалите заголовки , отправьте обратно только содержимое.

2) На стороне клиента: не устанавливайте параметр запроса ajax dataType и в случае успеха используйте следующий код для извлечения json:

success: function(data)
{
    try{
        jsonData = jQuery.parseJSON(data);
        // continue process with json encoded data
    }
    catch(e)  
    {
        // handle parsing error
    }

}