9.7Removing a Contact
We would like to display an anchor which, when clicked, removes an item from this list. For this we just can redefine renderContact:on:
as follows. We add another callback with the ’remove’ text, see Figure 72.
ContactListView>>renderContact: aContact on: html
html text: aContact name , ' ' , aContact emailAddress.
html text: ' ('.
html anchor
callback: [ self removeContact: aContact ];
with: 'remove'.
html text: ')'
ContactListView>>removeContact: aContact
Contact removeContact: aContact
Try it yourself. Click on the remove anchors. The corresponding contact entry will be removed from the database. When you’re done playing around be sure to reset the database as described at the end of Section 9.4.
It would be nice to get a confirmation before removing the item. The following method definition fixes that.
ContactListView>>removeContact: aContact
(self confirm: 'Are you sure that you want to remove this contact?')
ifTrue: [ Contact removeContact: aContact ]
We send the component (self) the message WAComponent>>confirm:
, which displays a “Yes/No” confirmation dialog (See Figure 73).
The method confirm:
returns true
if the user answers “Yes” and false
otherwise. This is very straightforward because Seaside handles all the complexity for you, which is amazing when you consider what a mess this kind of interaction is with many other web frameworks. Let’s look at what happens:
- The user clicks on the anchor, causing the web browser to submit a request to Seaside.
- Seaside finds and evaluates the callback for the anchor (our block of code).
- The callback sends
ContactListView>>removeContact:
, which in turn sendsWAComponent>>confirm:
. - The execution of
ContactListView>>removeContact
is suspended, and the confirmation page is returned to the user’s web browser. - The user clicks the “Yes” or “No” button causing their browser to send a request to Seaside.
- The confirmation component handles this request, “answering”
true
if the user clicked “Yes” andfalse
otherwise. - When the confirmation component answers, the
ContactListView>>removeContact:
method resumes execution and processes the answer fromconfirm:
, deleting the contact item if the answer wastrue
.
So, in Seaside, it is easy for a method to display another component, wait for the user to interact with it, and then resume execution when that component has completed its job. This is akin to modal dialogs in Graphical User Interface (GUI) applications, see Part III.