Dynamic Web Development with Seaside

9.5Listing the Contacts

Let’s create a component which displays a list of contacts:

WAComponent subclass: #ContactListView
instanceVariableNames: ''
classVariableNames: ''
poolDictionaries: ''
category: 'iAddress'
ContactListView>>renderContentOn: html
html unorderedList: [
Contact contacts do: [ :contact |
html listItem: [ self renderContact: contact on: html ] ] ]

In some Smalltalks, saving this method will raise a warning, telling you that the selector renderContact:on: is unknown. This is because we haven’t yet defined the method with that name, but you should confirm that this name is correct because we will define it in the next snippet:

ContactListView>>renderContact: aContact on: html
html render: aContact name; render: ' '; render: aContact emailAddress

Notice how we split up the rendering method. This is common practice in Seaside. Register this component as “contacts” and then browse it at http://localhost:8080/contacts and you should see a window similar to the one shown in Figure 70.

WAAdmin register: ContactListView asApplicationAt: 'contacts'

Displaying the contact database

Already, with just a few lines of very readable code, you are able to load data from a (very simple) data store and list that data on a web page. Let’s see how easy it is to start adding new records.

It is actually bad design to refer to the Contact class directly. It would be better to add a model instance variable to our component, but for now, we will stick with what we have in the interest of simplicity.

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.