jQuery does not work in IE11, but works in Chrome

Question

I have problem with jQuery. When I upload image in Chrome it performs the AJAX successfully and I am able to update the page with the response data. But in IE 11 and Firefox it does not. The code:

$(".newfoto").on('submit', (function(e) {
    $("#mailresult").html('<img src="themes/standart/iconss/spin1.gif" alt="loading..." /><p>Please, wait...</p>');
    e.preventDefault();
    $.ajax({
        url: "dataok.php?act=foto",
        type: "POST",
        data: new FormData(this),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            $("#mailresult").html(data);
            setTimeout(function() {
                $("#mailresult").empty();
            }, 2000);
            var imgTag = '<img src="image.php?imgid=' + escape($('.myphoto').attr('id')) + '" />';
            $('.myphoto').html(imgTag);
        },

        error: function() {}

    });
}));

Please format your code appropriately to make it readable. You need both proper indentation and to get rid of the double spacing. — jfriend00, Sep 16 '15 at 19:11
@jfriend00 which double spacing? I could not understand. sorry — Javid Karimov, Sep 16 '15 at 19:13
The code in your question has a blank line between nearly every actual line of code. — jfriend00, Sep 16 '15 at 19:19
Yes, that removed all the extra blank lines. As I said in my first comment, please add proper indentation too. If you don't know what I mean, then paste your code into here: http://jsbeautifier.org/ and and press the beautify button. — jfriend00, Sep 16 '15 at 19:22
@jfriend00 , ok, I beautified it. But there is no change. It does not work — Javid Karimov, Sep 16 '15 at 19:27
@Barmar , No, all javascripts work fine. This code also work fine in Chrome. But not in IE 11 and Firefox — Javid Karimov, Sep 16 '15 at 19:29
If you put an `alert()` in the function, do you see the alert? — Barmar, Sep 16 '15 at 19:31
FYI, `escape()` has been deprecated. You should be using `encodeURIComponent()` instead. — jfriend00, Sep 16 '15 at 19:31
@jfriend00 , ok. I will try. Barmar , yes it is inside document.ready — Javid Karimov, Sep 16 '15 at 19:33
@jfriend00 I changed escape() to encodeURIComponent(). No, the page does not reload in any browser . — Javid Karimov, Sep 16 '15 at 19:35
My guess is that it has something to do with the `FormData` support in different browsers. That object is only partially implemented in Firefox and IE. Try changing: `data: new FormData(this),` to `data: $(this).serialize(),`. — jfriend00, Sep 16 '15 at 19:38
No , it does not help. The problem is not in form data. Because form data successfully uploads image. The problem is in var img Tag or html(imgTag). May be I must change one of them — Javid Karimov, Sep 16 '15 at 19:45
donot take downvote personally.it's not aimed at you it's for the betterness of the question and answer both which is objective of SO. — , Sep 17 '15 at 03:36

score 1 · Answer 1 · edited May 23 '17 at 12:22

The correct way to prevent the form from submitting and reloading the page is to use a return false; at the end of the submit function. This will also replace e.preventDefault(); in your code.

Also, FormData is not supported on all browsers. See https://stackoverflow.com/a/2320097/584192. You may need to detect and workaround this.

$(".newfoto").on('submit', function(e) {
    $("#mailresult").html('<img src="themes/standart/iconss/spin1.gif" alt="loading..." /><p>Please, wait...</p>');
    $.ajax({
        url: "dataok.php?act=foto",
        type: "POST",
        data: (typeof FormData === 'function') ? new FormData(this) : $(this).serialize(),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            // success
        },
        error: function(jqXHR, status, error) {
            console.log(error);
        }
    });
    return false;
});

var imgTag = ''; $('.myphoto').html(imgTag); // The problem is in these lines. May be I can change it, but how ? — Javid Karimov, Sep 17 '15 at 17:35

jQuery does not work in IE11, but works in Chrome

1 Answers1