Problem with relative URLs and AJAX requests.

Hello.

I have a Rails app (3.0.3) that uses jQuery (1.4.4) to do some AJAX requests. For example, when doing a AJAX request on a page like "http://localhost:3000/users/3" with $("div#profile_box").load("profile"); the browser always tries to fetch from "http://localhost:3000/users/ profile". It simply ignores the "3". But when adding a trailing slash after the 3 then it uses"http:// localhost:3000/users/3/profile". Why does it not work without the trailing slash? I reproduced this under Chrome and Firefox (not tried any other browser). And this seems to be indeed a client side problem (I watch the request on the browser console). I know, this is not very Rails specific, but I already posted the problem in the jQuery forum without receiving any explanation yet. And I know there are a lot of Rails people using jQuery, so the above scenario is nothing special. How do you provide the URL to the jQuery AJAX functions? Do you have the same problem? (I reproduced it also under another system.).

Regards, Kai

I have a Rails app (3.0.3) that uses jQuery (1.4.4) to do some AJAX requests. For example, when doing a AJAX request on a page like "http://localhost:3000/users/3" with $("div#profile_box").load("profile"); the browser always tries to fetch from "http://localhost:3000/users/ profile". It simply ignores the "3". But when adding a trailing slash after the 3 then it uses"http:// localhost:3000/users/3/profile". Why does it not work without the trailing slash? I reproduced this

Pretend it's a file system... You are in the "users" directory. In that directory is a file called "3" and now you are asking for "profile". Without any slashes, it's going to assume that you want the file "profile" in the current directory which is "users" so you get "users/3".

It's more complicated than a file system though since you can't ensure a trailing slash. I might remove it. Apache might be configured to get rid of it, etc.

You can't prefix "profile" with a slash since that would pull up http://localhost/profile.

I think you're only option is to tweak the load() call... to pull in the value of document.location.href and append "profile" with a possible slash to separate them if it doesn't already exist. I don't know if jQuery/javascript has anything to make that simpler.

You might also be able to set the BASE HREF html tag, but that will most likely screw up all your image paths, etc...

-philip

Hm, that really sounds unhandy. As mentioned, I can simply use <a href="profile">link</a> and the "profile" gets appended to the full url. It doesn't matter in that case if there is a trailing slash or not. Why does Javascript has that problem and standard HTML not?! Does someone know of a good URL library for Javascript (or jQuery)?

Uuups, I just found out that HTML links behave the same way ... it seems I am too pampered with Rails link helpers :wink: But I still wonder what the easiest way would be to build correct URLs for Javascript then.

Kai Schlamp wrote in post #976711:

Uuups, I just found out that HTML links behave the same way ... it seems I am too pampered with Rails link helpers :wink:

Apparently so. If you don't understand relative URLs, you have no business doing Web development.

But I still wonder what the easiest way would be to build correct URLs for Javascript then.

Use absolute URLs (the *_url helpers will produce these).

Best,

KaiSchlampwrote in post #976711:

> Uuups, I just found out that HTML links behave the same way ... it > seems I am too pampered with Rails link helpers :wink:

Apparently so. If you don't understand relative URLs, you have no business doing Web development.

Thanks for the suggestion :stuck_out_tongue:

> But I still wonder > what the easiest way would be to build correct URLs for Javascript > then.

Use absolute URLs (the *_url helpers will produce these).

That is not an option for Javascript files that live in public/ javascript, as those won't be generated. An option I guess would be to set some kind of data-url tag and query that by using Javascript. But I handle it the pure Javascript way now with a little helper function.

Kai,

I've gone through this same headache. I too wanted to use a helper but couldn't. Have you considered using content_for in view and then reference it in the <head> section of the layout to generate the javascript?

I couldn't do it that way because I was doing AJAX calls so the <head> section didn't change.

HTH, Dan

Hi Dan ... sorry for the late reply.

I've gone through this same headache. I too wanted to use a helper but couldn't. Have you considered using content_for in view and then reference it in the <head> section of the layout to generate the javascript?

Considered yes, but decided against as I would like to retain the separation of the Javascript code. I just use a little Javascript helper function that handles the URL stuff. It works fine that way.

Best regards, Kai