jquery ajax modulo callback successo non viene chiamato

Question

Sto tentando di caricare un file utilizzando "AJAX", elaborare i dati nel file e quindi restituire alcuni di quei dati all'interfaccia utente in modo da poter aggiornare dinamicamente lo schermo.

Sto utilizzando il plug-in JQuery Ajax, jquery.form.js trovato a http://jquery.malsup.com/form/ per il javascript e utilizzando Django sul back-end. Il modulo viene inviato e l'elaborazione sul back-end avviene senza problemi, ma quando viene ricevuta una risposta dal server, il browser Firefox mi suggerisce di scaricare/aprire un file di tipo "application/json". Il file ha il contenuto JSON che ho cercato di inviare al browser.

Non credo che questo sia un problema con il modo in cui sto inviando il json in quanto ho una funzione modulare json_wrapper() che sto utilizzando in più posizioni in questa stessa applicazione.

Ecco ciò che la mia forma si prende cura sono applicati modelli di 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> 

Non vedrete alcuna presentare pulsanti perché sto chiamando presentare con un pulsante altrove e sto usando ajaxSubmit() dal plugin jquery.form.js.

Ecco il controllo codice 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); 
} 

Come potete vedere, ho ottenuto disperato di vedere il lavoro di funzione di callback successo e semplicemente ho un messaggio di avviso in caso di successo creato. Tuttavia, non raggiungiamo mai quella chiamata. Inoltre, la funzione error non viene chiamata e viene eseguita la funzione beforeSubmit.

Il file che mi rimetto ha il seguente contenuto:

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

Io uso 'successo' qui per indicare se il server è stato in grado di eseguire il comando post in modo adeguato. Se fallisse il risultato sarebbe qualcosa del tipo:

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

Il tuo tempo e il tuo aiuto sono molto apprezzati. Ho passato alcuni giorni su questo ora e mi piacerebbe andare avanti.

Answer 1

Nel caso qualcuno ha avuto un problema simile, ecco il javascript finale ho finito per usare:

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, ho passato ore con questo stesso problema passando il file js riga per riga. Funzionava un secondo e poi il successivo non lo era. Il mio problema era - avevo cancellato il div di destinazione per i risultati. Una volta rimesso a posto, ha funzionato bene.

Answer 3

È necessario chiamare $('#form-id').ajaxForm(); nel documento pronto evento jQuery così il plugin registra tutti i gestori di eventi.

Answer 4

Mi è successo anche. Il problema si è verificato che il server non stava convertendo l'intero oggetto nel JSON corretto. Modificato il valore restituito solo alle proprietà necessarie:

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