.ajax() call using jQuery 1.4.4 failing but works on jsFiddle?

I’m trying to use ajax() to grab content using this: http://jsfiddle.net/m4QCt/762/

It works for me on the jsfiddle site, but I can’t get it to work on my localhost WAMP setup for some reason. Any ideas why? Could this be an issue with how my Apache is setup? Maybe a firewall issue?

Firebug’s console returns a red response of the following:

GET http://www.yahoo.com/ 200 OK 142ms

If this is a cross-domain issue, why would jsfiddle be able to do it?

Hi,

Just tried this locally using xampp and it works as expected.
This means that it is very probably something to do with your setup.

Things to check:

  • Try turning the firewall off. It’s unlikely this is affecting anything, but just to be sure.
  • Make doubly sure that you are viewing the page via WAMP. The address in the address bar should start with http://localhost/…, not file:///C:/Users/
  • Try cutting the JS back to the bare minimum. Does this make any difference?

    javascript $.ajax({ url: baseUrl, type: "get", success: function(data) { $("#divs").html(data); } });

No dice.

I turned the firewall off, the page is definitely using my localhost page, and that code had the same affect.

This is an odd one and now that I think about it, I’m betting it’s what caused the issues with other AJAX issues I’ve had in the past…

I was originally thinking that I needed to enable an Apache module somewhere… If that’s the case, I’m not sure which needs enabled.

Does Firebug’s console say anything, or does it just fail silently?

Firebug indicates a successful GET response, but it’s in red-colored font (GET http://www.yahoo.com/ 200 OK 142ms)…
I’m not sure what this implies…?

It has Yahoo’s response headers, though. Is there anything that can be gleaned from that?

Hi,

I just looked at your code again.
I must be way too tired, as I totally missed the point of your first post.
I now see what you are trying to do.

How do you deduce that this works on the JSFiddle site?
For me it doesn’t work there or locally and I just see two empty select tags appended to the body.

Sorry for the confusion so far. I’m off to bed now!
I’ll have a look at this again tomorrow.

It seems to be an issue with how you were including the cross-domain-ajax plugin and also with how GitHub was serving it.
Therefore I uploaded it to my server and included it from there.
Now everything really does work, both remotely and locally in all of the major browsers.

Here’s a fiddle.
Here’s a demo.

Does that help at all?

Now I really am going to bed :slight_smile:

I’m having a hard time understanding some of this because I don’t understand how that cross_domain_ajax.js file plays a part in all this. If the fiddle example I posted in #1 above works without any explicit references to that file, it would lead one to believe that it’s unecessary since that fiddle example appears to work without it. But with your example, you include this, and yes, your example works on both the fiddle site AND my localhost…

I’m really scratching my head on this one.

Also, I never realized you needed a plugin to be able to make successful ajax() requests… Really weird, but thanks. I guess I’ll need to include that file from now on???

Hi,

It doesn’t.
Not for me, at least.

You need the plugin to make GET requests across domains.
Normally (without the plugin) cross-domain requests of this nature are blocked as they violate the same origin policy.

However, you don’t need the plugin when everything is on the same domain.
You can make as many GET requests to your own server as you like.

It doesn’t.
Not for me, at least.

I’m using FF 17 on Win7… Seems to work fine on my end. :S

You need the plugin to make GET requests across domains.
Normally (without the plugin) cross-domain requests of this nature are blocked as they violate the same origin policy.

However, you don’t need the plugin when everything is on the same domain.
You can make as many GET requests to your own server as you like.

Now see, I would’ve assumed that the same domain stuff was causing this until I found that script in the fiddle I posted–which seemed to shoot that out of the water.

Either way, Pullo, you rock. Thanks for helping me with this.

Hey, thanks :slight_smile:

I’m off out now, but I’ll test with FF17 and Win 7 later on, because if this works for you without a plugin, then I have misunderstood something about the nature of AJAX.

Watch this space.

Will do…

And while you’re at it, do you know of a way to stop the throbber? I’ve tried to use something like doc.close(); at the end of the success: block, but it’s not stopping it from constantly spinning.

Hi,

So, I’ve just been playing around with this.
It seems that it doesn’t work in Chrome or IE, because GitHub is serving the JS file with a MIME type of ‘text/plain’, which causes both browsers to throw errors.

Chrome says:

Refused to execute script from 'https://raw.github.com/padolsey/jQuery-Plugins/master/cross-domain-ajax/jquery.xdomainajax.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. fiddle.jshell.net/m4QCt/762/show/:1
[object XMLHttpRequest] 

whereas IE says:

SEC7112: Das Skript von "https://raw.github.com/padolsey/jQuery-Plugins/master/cross-domain-ajax/jquery.xdomainajax.js" wurde aufgrund eines MIME-Typenkonflikts blockiert. 

This appears to be considered a bug, at least by the Chome people.

I then tried installing Firefox 17 on Win 7 and surprisingly, the fiddle worked.
This had me scratching my head for a while until I realised that on my desktop PC, I had the “No Script” extension installed and despite me having granted the fiddle full permissions, this extension was still blocking something.
Then I disabled “No Script” and things worked as expected.
So, you were right :slight_smile:

Just to be complete, the fiddle also ran on Opera and Safari.

What throbber?