Let’s create a component which displays a list of contacts:
WAComponent subclass: #ContactListView
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'
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.