Web browsers allow you to navigate your browsing history using the back button. The problem is that when you press the back button, the application interface and the underlying model can be out of sync. When you press the back button, only the browser is involved and not the server and the server has no way to know that you changed. Therefore your UI can be out of sync from its domain. Seaside offers you a way to control the back button effect.
There are two kinds of synchronization problems: UI state and model state. Seaside offers a good solution for UI state synchronization.
Experiment with the problem. In this section, we show the back button problem and show how Seaside makes it easy to handle. Perform the following experiment.
- Browse the
WebCounterapplication that we developed in the first chapter of this book.
- Click on the ++ link to increase the value of the counter until the counter shows a value of 5.
- Press the back button two times: you should see 3 now.
- Click on the ++ link.
Your web browser does not show you 4 as you would expect, but instead displays 6. This is because the
WebCounter component was not aware that you had pressed the back button. This situation can also arise if you open two windows that interact with the same application.
Solving the Problem. Seaside offers an elegant way to fix this problem. Define the method
WAComponent>>states so that it returns an array that contains the objects that you want to keep in sync. In our
WebCounter example we want to keep the count instance variable synchronized so we write the method as follows.
^ Array with: count
This is not really what we want because the Seaside backtracking support is mostly intended for UI state and not model state. We want to backtrack the counter component, not the integer instance variable.
^ Array with: self
Redo our back button experiment and you will see that after pressing the back button two times you can correctly increment the counter from 3 to 4.