Dynamic Web Development with Seaside

20.4.1Defining a Callback

Our goal is to get notified whenever the heading is clicked. We add html request callback: aBlock to the click handler, where aBlock is a Seaside callback block, like the one we use for an anchor. We add the snippet as another click handler to the heading and add an instance variable to remember the visibility of our help text. This time we only hide the div tag with an inline style, if the element should be invisible.

Add the visible instance variable to the ToDoListView class, and then add the following:

ToDoListView>>initialize
super initialize.
visible := false
ToDoListView>>renderHeadingOn: html
| helpId |
helpId := html nextId.
html heading
class: 'helplink';
onClick: (html scriptaculous effect
id: helpId;
toggleAppear);
onClick: (html scriptaculous request "<-- added "
callback: [ visible := visible not ]);
with: self model title.
html div
id: helpId;
class: 'help';
style: (visible ifFalse: [ 'display: none' ]); "<-- added "
with: 'The todo application from the Seaside book'

Don’t forget to start a new session before playing with the new functionality, otherwise the instance variable won’t be initialized. Have a look at the generated source code. Seaside quietly combines the two AJAX snippets in the click handler of the tag:

Effect.toggle('id1', 'Appear'); 
new Ajax.Request('http://localhost:8080/todo', 
{'parameters': ['_s=woCPiIxqSIgkDMqu', '_k=4FL61fCv', '2'].join('&')})

As you can see, Seaside takes care of a lot of low level details for us. When we try the application it is actually quite hard to see that it works any differently than before; certainly for the end user it looks exactly the same as before. Behind the scenes it’s a different story: in the background our additional JavaScript code triggers a request that goes to the server and evaluates our callback block. You can put a logging statement Transcript show: visible; cr or a self halt into that block to see that it really evaluates the code.

Another very useful tool to observe how AJAX requests are passed between your web browser and Seaside is Firebug, a Firefox extension. We will have a look at this tool in the next section in great detail.

Copyright © 19 March 2024 Stéphane Ducasse, Lukas Renggli, C. David Shaffer, Rick Zaccone
This book is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 license.

This book is published using Seaside, Magritte and the Pier book publishing engine.