ASP.NET

Solution to IE10 Ajax Problem

IE10 is a great leap forward in Internet Explorer history infect it has many fundamental errors. Main problem that web developers face is it breaks all jQuery.Ajax() methods. This includes ASP.NET Ajax controls as ASP.NET Script Resource (ScriptResource.axd) uses jQuery. So now you can understand the depth of the problem. I thought this is a bug in the Beta and release preview and they’ll fix it in final release. But now I’ve got the final release of Internet Explorer 10 with the same problem which Microsoft ignored fixing the problem with Ajax POST requests in it not knowing the same issue breaks their own web forms built using ASP.NET

I searched a solution in the web for this few hours and could not come up with a solution yet. I wonder how Google missed it. Anyway the solution is pretty simple. Here’s what you got to do.

Add this tag between the

<head> </head>

tags.

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" >

This should solve your problem at once. We know that IE10 no more supports this. So we render the page in IE9 standards, but keeping the IE10 skin in contols.

Demo: http://sms.gishan.net/

Now close Internet Explorer. Then open IE again and load the page. If you have applied the code correctly, the IE compatibility view button should not be visible, and your website should load AJAX.

Troubleshooting:

Do not use CDATA tags to wrap the above meta tag. Use <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> DOCTYPE
 

Is it the only method?

No. But this is the easiest. In fact the problem is only with AJAX POST method. GET method works fine. Kindly join the discussion by adding your comment below to make the other readers’ life easy.

About Gishan Chaturanga

Gishan is a reverse engineer, software developer and a web designer. He has served many reputed organizations as a 3rd party business systems and solutions developer.

27 Comments

  1. Alina

    Thank you!!!
    One line and it fixed everything for me.

  2. Stanly

    Thank you very much. I didn’t think it is this easy..
    Now IE10 works with my AJAX site..

  3. Vincenzo

    Hi, I had your same problem, i tryed registy patches, microsoft patches, forums hints … none of them worked for me. The only solution was to introduce the “X-UA-Compatible IE9″ rule in the head of document as you suggest … this made posts started to work but a lot of all css improovements of the new IE 10 version were lost … so it was not a so good solution for me [:(

    When i was thinking about it no more the solution camed to me. I tryed to navigate in “InPrivate Browsing” mode and all worked as expected, nice css and correct ajax posts … so i understood it was a security issue!!! So I started disabling Browser’s add-ons, one by one, untill i found it. All the problems were caused by an add-on which was not fully compatible with IE10. So try my way, maybe is your case too …

    • Yury

      The problem is that we cannot ask out clients to remove or disable adds-on on their browsers.

  4. Mike

    Doesn’t work you add then add in between header tags. All you get is unable to detect that the browser is IE10 yet you still have all IE10 problems with AJAX cf 3.5. So in other words your solution makes it impossible for me to tell it is IE10 yet IE10 is still broken on the website. I wish there was a simple command to say this is Microsoft this is a very big mark of shame if your own software AJAX doesn’t work.

  5. Satheesh Thomas

    A Big THANKS to Gishan. It solved a big problem I was facing.

  6. The problem I am having now is with GET, IE 10 seem to response with 302 status, even thought the value has been changed in the server. now just a hack, I have to add time stamp to my ajax. Damn IE.

    • Hi suylong,
      IE caches all Ajax responses. Adding timestamp is the solution. :-)

      • Mark

        can you give an example of how to add a timestamp? thanks.

        • @Mark,
          Hope IHopeImHelpful had answered your question.

  7. kiran

    Hello,

    Its working fine in the page submiting.
    But the problem is its in not validating all other javascripts validation that are there in the application.

    please suggest me,
    thanks
    kiran

  8. Trent

    I use this method but it still aborts 1 in every 5-10 requests at random, I am using jquery 1.9.1 and use click from a standard click to trigger checking the form, then $(‘form’).submit(); to do the submission. There are no errors at all in any browser including back to IE7, however beautiful IE10 still aborts requests at random – no error message, no textStaus just ‘error’. This happens with default jquery and no other javascript on page – and it still aborts. Any one have any more suggestions would be great.

  9. IHopeImHelpful

    Mark: if you use jQuery for ajax you could add this once to the top of your script.

    $.ajaxSetup({
    cache: false
    });

    It makes jquery add a timestamp to all ajaxcalls

  10. Thank you

    • RajkumaR

      Superb ajax call now working thank you very much………

  11. Vinod

    Thank you Very much for this post !!

  12. Lizzy

    Hello.. i was VERY sad when i found out IE10 was not working for my site for all a LONG time.. got same problem but solved it differently… dont know if i can help anyone but this worked form me:

    i leave the
    “$(function(){
    $(“#comment_form”).submit(function(){
    dataString = $(“#comment_form”).serialize();
    $.ajax({
    BLA BLA BLA BLA
    return false;
    });
    });”
    in the code… for all working browser to work with…
    and added this to the code ”
    if (isset($_POST['submit_comment'])) {
    BLA BLA BLA BLA
    }”
    for IE10, because IE10 will post the data as a form(page refresh) instead of posting it to the ajax code…
    I am not that technical but this worked for me.. posting data to ajax(no page refresh) in FF, OP, CHR and posting the data(with page refresh) in IE10.
    Excuse me for me bad English but i hope this will help someone!

    • bhavin

      where you wrote this code… please put full details

  13. Jano

    Thank you very much, this was a big help for me. :)

  14. Uday

    you saved me buddy,Thank you very much

  15. Erich

    Thanks! You solved my problem!

  16. Abdul Samad

    but in my case it is not working

  17. Abdul Samad

    This is my Code

    TestForm.aspx
    ———————-

    $(document).ready(function f() {
    alert(‘ready’);
    gettext();
    });
    function gettext() {
    alert(‘hi’);
    var HotelID = 49;
    var selectedText = ‘New Status Temp’;
    var EmailTypeId = 2;

    $.ajax
    ({
    url: ‘../AppAjax.aspx?TableName=GetTemplateByID&hotelid=’ + HotelID + ‘&TemplateName=’ + selectedText + ‘&TemplateId=’ + EmailTypeId,
    datatype: ‘json’,
    mtype: ‘GET’,
    cache: false,
    async: false,
    complete: function(jsondata, stat) {
    alert(stat);
    debugger;
    if (stat == ‘success’) {
    //var templateText = jQuery.parseJSON(jsondata.responseText);
    } else alert(‘error with ajax call back’);
    },
    Error: function() {
    alert(‘Error: with ajax call back’);
    }
    });
    }

    a
    b
    c

    first time is displaying succes, when i changing dropdown it is not working

  18. Dhahi

    I spent 3 days looking for a solution and I almost fad up. I had a solution working fine in Android and when tried to bring it to Window Phone 8 using the Phonegap builder I could not solve the issue of not $.ajax not executing the send data form. the meta-data and DOCTYPE tags solved my issue.

    • Ravi

      Hi Dhani,
      What is the Doctype you used?

Leave a Reply

30% Discount ($4.95 /month) for web hosting. Click here!!!
Unlimited domains/websites, Unlimited bandwidth.