Home > DeveloperSection > Forums > Ajax picture upload fails on iOS generates internal server error
David Miller

Total Post:30

Points:210
Posted on    October-28-2014 2:53 AM

 iPhone iPhone  Ios  Ios 7 
Ratings:


 1 Reply(s)
 669  View(s)
Rate this:
I implemented an ajax file upload Everything works fine in all browsers, but Safari on iOS. As response I get an Internal Server Error.

I checked my serverside code, but there's nothing wrong. I even get the error, if I write a die(); at the first line of code in the serverside PHP script. It seems as if Safari uploads the picture wrongly. Maybe somebody can help me fix this bug. Thanks in advance!

This is the HTML-Code:

<input type="file" id="pict" accept="image/*">

<input type="text" id="field1">

<input type="text" id="field2">

<button id="send">Send</button>

And this the Javascript:

    var files = false;

 

    $('#pic').on('change', prepareUpload);

 

    function prepareUpload(event) {

        files = event.target.files;

    }

 

    $("body").on("click", "#send", function () {

        uploadTB();

    });

 

    function uploadTB() {

        var postdata = new FormData();

        if (files !== false) {

            $.each(files, function (key, value) {

                postdata.append(key, value);

            });

        }

        postdata.append("field1", $("#field1").val());

        postdata.append("field2", $("#field2").val());

        $.ajax({

            url: 'http://example.org/index.php',

            type: 'POST',

            data: postdata,

            cache: false,

            processData: false,

            contentType: false,

            success: function (data) {

                console.log("sucess");

            },

            error: function (jqXHR, textStatus, errorThrown) {

                console.log(jqXHR, textStatus, errorThrown);

            }

        });

    }



Tom Cruser
Tom Cruser

Total Post:28

Points:196
Posted on    October-28-2014 2:54 AM

try this:

    var files = false;

 

    $('#pic').on('change', prepareUpload);

 

    function prepareUpload(event) {

        files = event.target.files;

    }

 

    $("body").on("click", "#send", function () {

        uploadTB();

    });

 

    function uploadTB() {

        var postdata = new FormData();

        if (files !== false) {

            $.each(files, function (key, value) {

                postdata.append(key, value);

            });

        }

        postdata.append("field1", $("#field1").val());

        postdata.append("field2", $("#field2").val());

        $.ajax({

            url: 'http://example.org/index.php',

            type: 'POST',

            data: formData,

            mimeType: "multipart/form-data",

            contentType: false,

            cache: false,

            processData: false,

            success: function (data) {

                console.log("sucess");

            },

            error: function (jqXHR, textStatus, errorThrown) {

                console.log(jqXHR, textStatus, errorThrown);

            }

        });

    }


Don't want to miss updates? Please click the below button!

Follow MindStick