Struts2 Datei-Tag funktioniert nicht mit $ .ajax?

Question

Ich habe einen <s:file> Tag innerhalb des Formulars. Wenn ich das Formular per Formularübermittlung absende (z. B. Übermittlungsschaltfläche usw.), funktioniert alles in der Aktionsmethode. Allerdings, wenn ich meinen Code zu ändern:

$.ajax({ 
    url: "actionClass!actionMethodA.action", 
    type: "POST", 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
       alert('Error ' + textStatus); 
       alert(errorThrown); 
       alert(XMLHttpRequest.responseText); 
      }, 
    data: $(form).serialize(), 
    success: function(data) { 
       ... 
      } 
}); 

Im Backend, das file Feld ist immer null.

Das Dateifeld wird in der Action-Klasse wie folgt definiert (mit Setter und Getter):

private File impFileUrl; 

Ist es, weil jetzt die Form serialisiert wird, so dass das Dateifeld nicht mehr richtig in die eingestellt werden kann, Backend?

Answer 1

Es ist, weil jQuery.serialize() serialisiert nur Eingabeelemente, nicht die Daten in ihnen.

Nur "erfolgreiche Steuerelemente" werden serialisiert. Kein Senden Schaltflächenwert wird serialisiert, da das Formular nicht mit einer Schaltfläche gesendet wurde. Damit ein Formularelementwert in die serialisierte Zeichenfolge aufgenommen wird, muss das Element ein name-Attribut aufweisen. Werte aus den Checkboxen und Optionsfelder (Eingänge vom Typ "Radio" oder "Checkbox") sind nur dann mit enthalten, wenn sie geprüft werden. Daten von Dateiauswahlelementen sind nicht serialisiert.

Aber es bedeutet nicht, dass Sie keine Dateien mit Ajax hochladen können. Zusätzliche Funktionen oder Plugins können zum Senden von FormData object verwendet werden.

Sie können auch FormData mit jQuery verwenden, wenn Sie die richtigen Optionen einstellen: [? Wie kann ich Dateien asynchron hochladen]

var fd = new FormData(document.querySelector("form")); 
fd.append("CustomField", "This is some extra data"); 
$.ajax({ 
    url: "actionClass!actionMethodA.action", 
    type: "POST", 
    data: fd, 
    processData: false, // tell jQuery not to process the data 
    contentType: false // tell jQuery not to set contentType 
});