CAPÍTULO 5. SOLUCIONES AL PROBLEMA PLANTEADO
5.1. Resultados del Primer Objetivo
Not every click should change the url and in many applications there is no clear "back" situation. If you browse your mail inbox for example a click to open a message may be a clear "navigate to" situation. When you delete the message by using a click on a button the main UI might navigate for you to the next message in the list. But where is the "back" position now - on the deleted mail?
You can also argue that moving on to the next mail is neither forward nor back but something like up and down and back will always bring you back to the list view you started.
So what I want to say is that the (forward and) back direction is often very application or problem specific. With AJAX you have the chance to model these situations the way you like and the way that is the best for your application and you are not bound to the GET and POST requests done by hyperlinks and forms.
I use the url as a textual key to the global addressable state of an Ajax application. By moving some information into the url and reading this information out of the url when a page loads or the urls changes, there is a clear interface between the Ajax page and the external world that can be used for storing browser history, favorites and links.
The back problem is technically solved
If you look for a good article on how to implement a technical solution to the problem have a look at the article "AJAX: How to Handle Bookmarks and Back Buttons" by Brad Neuberg
http://www.onjava.com/lpt/a/6293.
... by tricking IE
The Mozilla/Firefox solves this problem really straight forward and it works as expected.
URL is changed.
By assigning a new value to thewindow.location.hash property a new entry in the history list is created.
The IE is very confused about URL-hash values hat do not really point to existing anchors and does not record any history and needs an invisible iframe with a page coming from the same server. It's a little bit tricky to get all situations working and you can see the current implementation by looking into the JavaScript implementation of the PropHistory Behaviour. Have a look at the source:
http://www.mathertel.de/AJAXEngine/ViewSrc.aspx?file=~/controls/PropHistory.js
An Implementation
The AJAXEngine already has a client side state mechanism (Page Properties or DataConnections) I introduced in September 2005 that stores key-value pairs. Instead of building a new API and leave it to the AJAX application to call a method to change the URL you only have to declare what page properties should be used in the URL. When a Page Property's value changes the URL is updated automatically and when the URL changes all connected controls will get informed about it.
When one of the properties, that define a state that should be persisted to the history changes, a new history entry is recorded.
All you need to do to make it work is to include the PropHistory control:
<ajax:PropHistory runat="server" stateList="version,book,chapter" propList="vers" />
I've added 2 attributes to the PropHistory web control that can be declared to avoid some scripting on the page:
stateList specifies the page properties that together form the current state of the page. A change to the value of any of these properties will cause a new entry in the history of the browser.
propList specifies the page properties that are persisted in the hash part of the url so that hyperlinks will work.
The implementation takes care of the fact that all properties in the statList must also be part of the url but you don't have to specify them again in the propList attribute.
If you need some default-values that will be used when no values are given by the URL then script them like this:
<script defer="defer" type="text/javascript"> // set default values:
jcl.DataConnections.Load("version", "luther1912"); jcl.DataConnections.Load("book", "1");
jcl.DataConnections.Load("chapter", "1"); jcl.DataConnections.Load("vers", "1"); </script>
The sample comes from the Bible reader application:
http://www.mathertel.de/AJAXEngine/S03_AJAXControls/BiblePage.aspx
When you navigate through the verses of a chapter, only the URL gets changed. The navigation to a new book, version or chapter a new entry in the history stack is created.
Donald E. Knuth likes reading any book chapter 3 verse 16 and specially
http://www.mathertel.de/AJAXEngine/S03_AJAXControls/BiblePage.aspx#version=sf_kjv_strongs_rev 1b&book=43&chapter=3&vers=16
An important verse of the Da Vinci code story by Dan Brown is
http://www.mathertel.de/AJAXEngine/S03_AJAXControls/BiblePage.aspx#version=en_gb_KJV2000_1 &book=18&chapter=38&vers=11