jquery ajax devolución de llamada de éxito no se llama

Question

Estoy tratando de cargar un archivo con "AJAX", procesar datos en el archivo y luego devolver algunos de esos datos a la IU para que pueda actualizar dinámicamente la pantalla.

Estoy usando el complemento de formulario JQuery Ajax, jquery.form.js encontrado en http://jquery.malsup.com/form/ para el javascript y usando Django en el back-end. Se está enviando el formulario y el procesamiento en el back-end se realiza sin problemas, pero cuando se recibe una respuesta del servidor, mi navegador Firefox me pide que descargue/abra un archivo de tipo "application/json". El archivo tiene el contenido json que he intentado enviar al navegador.

No creo que esto sea un problema con la forma en que estoy enviando el json ya que tengo una función modularizada json_wrapper() que estoy usando en varios lugares en esta misma aplicación.

Esto es lo que se ve mi forma después de aplicar las plantillas de Django:

<form method="POST" enctype="multipart/form-data" action="/test_suites/active/upload_results/805/"> 
    <p> 
    <label for="id_resultfile">Upload File:</label> 
    <input type="file" id="id_resultfile" name="resultfile"> 
    </p> 
</form> 

Usted no verá ningún botones de envío porque yo estoy llamando presentar con un botón en otro lugar y estoy utilizando ajaxSubmit() de la plugin jquery.form.js

Aquí es el control de código javascript:

function upload_results($dialog_box){ 
    $form = $dialog_box.find("form"); 
    var options = { 
      type: "POST", 
      success: function(data){ 
       alert("Hello!!"); 
      }, 
      dataType: "json", 
      error: function(){ 
       console.log("errors"); 

      }, 
      beforeSubmit: function(formData, jqForm, options){ 
        console.log(formData, jqForm, options); 
       }, 
     } 
    $form.submit(function(){ 
     $(this).ajaxSubmit(options); 
     return false; 
    }); 
    $form.ajaxSubmit(options); 
} 

Como se puede ver, he recibido desesperado por ver el trabajo de la función de devolución de llamada de éxito y simplemente he creado un mensaje de alerta en caso de éxito. Sin embargo, nunca llegamos a esa llamada. Además, no se llama a la función error y se ejecuta la función beforeSubmit.

El archivo que regrese tiene el siguiente contenido:

{"count": 18, "failed": 0, "completed": 18, "success": true, "trasaction_id": "SQEID0.231"} 

utilizo el 'éxito' para indicar si o no el servidor era capaz de ejecutar el comando pos adecuadamente. Si fallara, el resultado sería similar a:

{"success": false, "message":"<error_message>"} 

Se agradece mucho su tiempo y ayuda. He pasado unos días en esto ahora y me encantaría seguir adelante.

Answer 1

Por si alguien tenía un problema similar, aquí está la última Javascript Terminé usando:

function upload_results_dialog($data_elem){ 
    var $dialog_box = $("#ajax-dialog-box"), 
    data = $data_elem.attr("data"); 
    $.ajax({ 
     url: "../upload/" + data+ "/", 
     success: function(response){ 
      $dialog_box.html(response); 
      $dialog_box.dialog("option", 
       { 
        title: "Upload", 
        height: 260, 
        width: 450, 
        buttons: { 
         Cancel: function(){ 
          $(this).dialog('close'); 
         }, 
         Upload: function(){ 
          upload($(this)); 
         } 
        } 
       } 
      ); 
      $dialog_box.dialog('open'); 
     } 
    }); 
} 
function upload($dialog_box){ 
    var $form = $dialog_box.find("form"), 
     iframe = $dialog_box.find("iframe"), 
     $html = $($iframe.contents()), 
     $iframe_form = $html.find("form"); 
    $iframe_form.html($form.contents()); 

    //Set the onload function 
    $iframe.attr("onload","check_file_uploaded_valid()"); 
    $iframe_form.submit(); 
} 

Answer 2

Ok Acabo de pasar horas con este mismo problema yendo a través del archivo js línea por línea. Estuvo trabajando un segundo y luego al siguiente no fue. Mi problema era: había eliminado el div de destino para los resultados. Una vez que lo puse de nuevo, funcionó bien.

Answer 3

es necesario llamar a $('#form-id').ajaxForm(); en caso jQuery lista de documentos para el plugin registra todos los controladores de eventos.

Answer 4

Me ha sucedido a mí también. El problema resultó ser que el servidor no estaba convirtiendo el objeto completo en el JSON correcto. Cambié el valor de retorno a solo las propiedades que necesitaba:

return Json(new {Id = group.Id, Name = group.Name});