FormData mit jquery abschicken funktioniert nicht in Safari < 11


June 21, 2018 at 18:44
JavaScript

Das Abschicken eines Formulars mit Upload Feldern wird durch FormData eigentlich ziemlich erleichtert. Leider musste ich feststellen, dass das Abschicken mit einer älteren Safari Version leider nicht funktionierte. Es gab auch keine vernünftige Fehlermeldung, die angepeilte php Datei hörte einfach nicht auf zu laden. So sah der ajax request aus: 

data = new FormData($('#theForm')[0]);
data.append('action', 'action_name_for_wordpress_ajax');

$.ajax({
    url: url,
    type: 'POST',
    dataType: 'json',
    cache: false,
    data: data,
    processData: false,
    contentType: false,
    success: function(res){
        if(res.success){
            alert("success");
        }
    },
    error: function(res){
        console.log("error"+res.responseText);
    }
});

Nach längerem Suchen habe ich irgendwo gelesen, dass Safari mit diesem Request anscheinend nicht klarkommt, sobald Uploadfelder leer sind. Das heißt, man muss vor dem Senden überprüfen, ob die Felder gefüllt sind und wenn nicht diese aus dem FormData entfernen: 

data = new FormData($('#theForm')[0]);
//more data manipulation...

//special case: safari doesnt like this type of subbmitting data if file fields are empty.
$('input[type="file"]').each( function(key, item){
    if($(item).val() == ""){
        data.delete($(item).attr('id'));
    }
});

//now submit the ajax request

mit data.delete funktioniert das ganze dann einwandfrei. 


Tags: JavaScript safari


Hinterlasse einen Kommentar:
Search