32 Stimmen

Fallback für FormData in IE 8/9

FormularDaten gibt es im IE 8/9 nicht, aber ich brauche diese Funktion in diesen Browsern. Gibt es dafür einen guten Fallback?

Ich würde versuchen, json-Daten zu senden, aber ich muss eine Datei an den Server übergeben. Ich hänge diese Datei an die formData in modernen Browsern und senden Sie einfach eine XHR Anfrage. Weil FormData im IE 8/9 nicht vorhanden ist, schlägt dies offensichtlich fehl.

// I cant seem to get this to work with a file.
$.ajax({
    url: '/genericHandlers/UploadDocsFile.ashx',
    type: "POST",
    data: model.toJSON(),
    contentType: 'application/json'
    }).done(function  (data) { 
       log('stuff happened!');
    });

Vielleicht ist eine Alternative zu einem gefälschten Formular-Objekt in js erstellen dann die Daten zu, dass anhängen?

8voto

Dmitry Polushkin Punkte 3063

Ich kenne nur eine mögliche Lösung, aber es ist nicht wirklich 1-1 Fallback für IEs. Es gibt keine mögliche Kommunikations-API für das Senden von Dateien, da man in alten Browsern keine Eingabefelder binden kann, wie in modernen Browsern mit FormData. Aber Sie können das ganze Formular mit einem iframe senden. Für diesen Fall können Sie verwenden jquery.form Plugin, das XHR DataForm und iframe unterstützt (Daten werden mit iframe gesendet, wenn der Browser keine FormData API unterstützt).

4voto

Sie können die Datei manuell mit XMLHttpRequests senden, es gibt viele Informationen dazu aquí .

Sie könnten testen, ob der Browser die FormData Objekt zuerst mit:

if(typeof FormData !== 'undefined')
   ...

MDN hat eine diese Funktion die Sie für den Fallback ändern könnten:

var XHR = new XMLHttpRequest();
var urlEncodedData = "";
var urlEncodedDataPairs = [];
var name;

// We turn the data object into an array of URL encoded key value pairs.
for(name in data) {
  urlEncodedDataPairs.push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name]));
}

// We combine the pairs into a single string and replace all encoded spaces to 
// the plus character to match the behaviour of the web browser form submit.
urlEncodedData = urlEncodedDataPairs.join('&').replace(/%20/g, '+');

0voto

Jade Steffen Punkte 110

Diese Antwort geht nicht unbedingt auf die von Ihnen gestellte Frage ein, und deshalb verstehe ich, wenn die Mods sie entfernen.

Ihre Frage stand jedoch in engem Zusammenhang mit einem Thema, das ich untersucht habe, nämlich wie man Drag & Drop Uploads über FormData() mit graceful degradation für ältere Browser anbietet ?

Es gibt eine wunderbare Bibliothek namens dropzone.js die eine perfekte Lösung für mein Problem bietet. Das Beste daran ist vielleicht, dass die Bibliothek eine sofort einsatzbereite, elegante Degradierung bietet, um Datei-Uploads auf älteren Browsern zu unterstützen, wie hier beschrieben .

Um es mit den Worten der Quelle zu sagen:

Wenn der Browser nicht unterstützt wird, bietet die dropzone.js-Bibliothek eine anpassbare Fallback-Klasse, die ein Eingabefeld und eine Schaltfläche zum Senden enthält.

Ich hoffe, diese Informationen helfen jemandem, der wie ich auf der Suche nach einer einfach zu implementierenden und eleganten Lösung für das Hochladen von Dateien ist.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X