Scriptacu-list Tutorial(Part 1)

Learning Seaside is fun and there are a number of good tutorials out there (but beware that some don’t use the latest Seaside 2.7 release) and a number of good blogs (I especially recommend Ramon Leon’s Blog). But it can still be a bit tricky to find examples of exactly what you want. What I’d like to do over the next couple of posts is provide a worked example of a commonly used presentation technique with an extra Scriptaculous twist.

The Big Picture

One of the first things I look to do in a web framework is to create a page showing a list of items with each item having a hyperlink to a maintenance page for the item. It’s a pattern I use again and again in web applications but nothing does it as well as Seaside.

So I’ll whet your appetite today by showing you the screens we will build over the next few days.

The application is a simple Contact List. So first we have a page for editing contact details…

We then want a list of all our contacts looking something like…

Finally we will add a nice scriptaculous effect to show and hide contact details in-line…

Getting Started

So for a simple start today we’ll create our domain model in Squeak. We will create two classes MyAddressBook and MyContact…

1. Create a new category for your classes, say, MyContacts
2. In your category create a new class MyAddressBook (for now you can simply subclass Object) with an instance variable contacts
3. Create a getter for contacts that lazy initializes to an empty OrderedCollection…
   

   
contacts
^contacts ifNil: [contacts := OrderedCollection new]


4. We will also create an instance method to add a contact to the address book (We won’t bother with deleting contacts – you never know when they will come in useful )
   

   addContact: aContact
self contacts add: aContact

5. Now create another new class MyContact with instance variables firstName, surname, dateOfBirth, telephoneNumber and emailAddress
6. Create a setter and getter method for each variable. E.g.
   

   firstName: aString
firstName:= aString


   firstName
^firstName

7. For simplicity we will lazy initialize dateOfBirth to be today’s date.
   

   dateOfBirth
^dateOfBirth ifNil: [dateOfBirth:= Date today]


That will probably do for starters – no Seaside yet just everyday Smalltalk . We will pick up here later.

Explore posts in the same categories: Scriptaculous, Seaside, Smalltalk