Bookmarkabale ajax calls with MVC routing

Question

I have a page with a menu that uses JQuery AJAX calls to populate the page with. To reflect any changes I update the URL with a #... instead of ?... or /... So an URL that originally reads : htpp://localhost/pages/index/id=1 would look like : http://localhost/#pages/index/id=1. If a user bookmarks this, and later comes back to the page, I wonder if it's possible to use the second URL in my route decoding, or if I have to load it blank, then use the same JS/Ajax to populate the page?

In my mind it is problematic to use Ajax in these cases if a user copies the link and mails it to a friend with JavaScript disabled.

edit#1: Fixed some spelling.

edit#2: To clarify the question a bit: I want a site where I can do the following: (a): with javascript turned on, use ajax calls to replace the content of a div (without reloading the page) (b): with javascript turned on, bookmark the page as it is after the ajax call i (a) (c): take the URL, send it to a person with noscript turned on, and have the same page as after the ajax call was made.

(a) and (b) works just fine on my page but (c) is seemingly impossible.

Answer 1

This not possible simply because everything that comes after the # sign (fragment identifier) is never sent to the server and there's no way for the server to ever capture this value, so no routing with it.

Answer 2

You could try replacing the '#' with a '?' This will send the rest of it as a get variable, so you may need to do some tweeks, such as change the format to http://localhost/?pages=index&id=1

There are some fancy things you can set up with the web server so that localhost/article/fancystuff is re-directed to localhost/article.php?title=fancystuff

There are a lot of ways of allowing for an AJAX site to work with bookmarks and the back button. But you should ask your self, do you want people to do certain things. Generally, AJAX is used for more advanced web-applications that do not map well to the traditional back and forth model.

EDIT

What with you additions to the question. I will say that seeming as you want to fully support users who are scared of Javascript that you will need to make your site work perfectly with out any AJAX at all. But you should design it in such a way, that the content of pages are included from separate files. This means that when you add in the additional Javascript, it can load the file and place it more or less directly into the content holder on your page.

You do need to remember that you can't force some one to accept a bookmark or force a change to a book mark. What you are after may be best served suing cookies. Luckily, even less people are scared of cookies, hardly anyone disables them, unless they are either paranoid or up to something.

Answer 3

Currently, the only portion of a URL you can update without causing the browser to redirect is the hash. This portion of the URL is not sent to the server in a request and is only available for client-side processing, so it cannot be used to provide a javascript-free way of providing a link.

The issue you are facing is a common one amongst those using AJAX. The best solution I've encountered is to provide a way to view any AJAX-loaded state of every page through a "true" URL, one that will be passed to the server.

This means you have one URL which provides a "snapshot" of a page's state:

http://localhost/pages/index/1/someaction

And an AJAX-specific URL which provides the local state of the page in the client's browser:

http://localhost/pages/index/1#someaction

What you then have to do is provide some means of generating the "snapshot" link to the page from the AJAX version. A "Link to this Page" or "Permanent Link" button is a reasonable option.