Dynamic Web Development with Seaside

2.4.7Adding Behavior

Now we can add some actions to our component. We will start with a very simple change; we will let the user change the value of the count variable by defining callbacks attached to links (also known as anchors) displayed when the component is rendered in a web browser, as shown in Figure 14. Using callbacks allows us to define some code that will be executed when a link is clicked.

A simple counter with actions

We modify the method WAComponent>>renderContentOn: as follows.

WebCounter>>renderContentOn: html
html heading: count.
html anchor
callback: [ self increase ];
with: '++'.
html space.
html anchor
callback: [ self decrease ];
with: '--'

Don’t forget that WAComponent>>renderContentOn: is on the instance side.

Each callback is given a Smalltalk block: an anonymous method (strictly, a lexical closure) delimited by [ and ]. Here we send the message callback: (to the result of the anchor message) and pass the block as the argument. In other words, we ask Seaside to execute our callback block whenever the user clicks on the anchor.

Click on the links to see that the counter get increased or decreased as shown in Figure 15.

A simple counter with a different value

Copyright © 23 April 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.