Jquery AJAX doesnt work in IE

@subharbNov 16.2009

Hello guys, I created a page where I do 2 ajax calls with jquery, the problem comes with IE, everything developes as usual with FF but IE doesnt show anything.
here’s the link.
~~[url]~~http://www.samanthacatering.com/pruebas/pagina/index.html[/url]

You have to click on “Conocenos” and “Galeria” those have a click event that makes the ajax call.

Any help will be more than welcome. thanks!

to post a comment

JavaScript

13 Comments(s) _↴

@jamesbcox1980Nov 16.2009 — #I get the following error:

Message: Can't execute code from a freed script

Line: 434

Char: 3

Code: 0

URI: http://www.samanthacatering.com/pruebas/pagina/lightbox/lightbox.js[/QUOTE]

I seem to remember there being some issues with lightbox in IE. The problem comes when META tags are placed [I]after[/I] the SCRIPT tags in the header. If you make sure to move all META tags up in the header so they precede all SCRIPT tags, this error will go away, and you should be able to continue debugging.

I'm not saying it will fix the page complete, but at it will fix that error so we can move on.

@subharbauthorNov 16.2009 — #Hello, I moved the meta tag before the scripts.

Still not working, also what tool are you using to get those errors? I just installed Internet Explorer Developer Bar but It doesnt seem to show any errors....

@jamesbcox1980Nov 16.2009 — #Internet Explorer will put a little icon in the bottom let corner in the status bar that looks like a white page with a yellow and black exclamation point. Double click on that and you'll see the error message. Also, if you get IE8, you can use developer tools to check in IE8, IE7, IE7 quirks mode, etc.

As I said, it probably wouldn't fix the main problem, but at least we got that error taken care of. Now I can take a look at what else is wrong.

@jamesbcox1980Nov 16.2009 — #It appears the Ajax request is never being made in IE, so there's no error returned. I wonder if it might be HTML related, or if a script that's supposed to assign the onclick even isn't assigning correctly.

@jamesbcox1980Nov 16.2009 — #Also, you moved your meta tag ABOVE the head tag, and it needs to be at the top of it, but still inside of it. I ran your code through W3c validator, and got 733 errors. You used XHTML 1.0 strict doctype, but used a mixture of HTML and XHTML transitional. Many of these things can cause errors in IE that prevent scripts from working properly, especially if most of your scripts rely on the DOM to work (which in your case is true). You'd be surprised at how many issues are resolved by using a validator.

Go here and paste all your HTML into the textarea. And try to fix some of the errors reported.

Remember <img> tags are closed in XHTML, so they should look like this

[CODE]
 <img src="/someimage.gif" width="50" height="50" border="0" alt="Some Image" title="Image Title" [B][COLOR="DarkRed"]/>[/COLOR][/B]
 [/CODE]

Once you've fixed some errors, others will automatically be corrected, so it will move quickly. But move down the list, fixing one error at a time, then refreshing. I like to fix my HTML right in the textarea, then copy and paste it back into my document once it's fixed.

Anyway, I think maybe the HTML errors are causing the jQuery DOM functions to fail. If none of this fixes the problem, at least you will have valid XHTML!!!

@subharbauthorNov 17.2009 — #Thanks dude, I will fix all those and tell you when its done, thanks!

@subharbauthorNov 18.2009 — #Hello I fix those error now it says "This document was successfully checked as XHTML 1.0 Transitional!", so what to do next?

Thanks for your help!

@jamesbcox1980Nov 18.2009 — #Ok, now that we've removed all those errors, and now we know that wasn't the cause, let's start debugging the AJAX. In your second function in formulario.js there is a function inside the "success:" definition. We need to add an alert("whatever") in there before the if() statements. If the alert works, we know the ajax itself is working and the problem is something in the function it fires.

[CODE]
 function desaparece(){
 $('#overlay2').fadeOut('slow');
 $('.footer').fadeOut('slow');
 $('#contacto #message').fadeOut('slow');
 $('#info_contacto').fadeIn('slow');
 $('#webmaster #message').fadeOut('slow');
 $('#info_webmaster').fadeIn('slow');
 $('input').value(""); 
 
 }
 $(function() { 

 $('.botones').each(function(i){
 $(this).click(function(){
 var datString = 'destino='+i+'&nombre='+$("input.nombre:eq("+i+")").val()+'&telf='+$("input.tele:eq("+i+")").val()+'&email='+$("input.email:eq("+i+")").val()+'&asunto='+$("input.asunto:eq("+i+")").val()+'&cuerpo='+$("textarea.cuerpo:eq("+i+")").val(); 
 //alert(datString);
 $.ajax({ 

 type: "POST", 

 url: "envia_form.php", 

 data: datString, 

 success: function() { 
 [B][COLOR="Red"]alert("Ajax is working.");[/COLOR][/B] 
 if (i == 0) {
 $('#contacto #info_contacto').fadeOut();
 $('#contacto').append("<div id='message'></div>");
 
   }
   else {
   $('#webmaster #info_webmaster').fadeOut();
   $('#webmaster').append("<div id='message'></div>");
   } 
   $('#message').html("<center><h2>Informaci&#243;n enviada correctamente!</h2></center>") 
   .append("<center><p>Nos pondremos en contacto contigo pronto.</p><img src='fotos/check.png'></center>") 
   .hide() 
   .fadeIn(1500, function() { 
   $('#message').append("<img id='checkmark' src='images/check.png' />"); 
   }); 
   setTimeout("desaparece()",3000);
   } 
   }); 
   return false; 
   });
  });
 });
 [/CODE]

@jamesbcox1980Nov 18.2009 — #Actually i think that's the wrong function.... maybe we need to be looking at principal.js instead.

@subharbauthorNov 19.2009 — #True, formulario.js works fine, is the one that happens after clicking on Galeria or conocenos, both in principal.js

Thanks!

@subharbauthorNov 19.2009 — #Hey guys, I just realised the ajax function only has problems with the html, I made the test with a plain black html and it worked fine.

Could you take a look at the html that it's being called and tell me what could be wrong?

thanks!

@subharbauthorNov 27.2009 — #Hey, I solved the issue.

I just VAlidator also with the page that was being queried and now it works!

@jamesbcox1980Nov 30.2009 — #Hey sorry it took me so long to get back to you! I was sick the previous week and then out for Thanksgiving last week. I'm glad you solved your issue!

Also in #JavaScript _↴

Javascript Validation/Running a Implement checkbox on off Javascript frames question

Success!

Help @subharb spread the word by sharing this article on Twitter...

Tweet This

Jquery AJAX doesnt work in IE

13 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Jquery AJAX doesnt work in IE

13 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

13 Comments(s) _↴

Also in #JavaScript _↴