Controlling Output with Conditional Regions

What happens if you click a topic that contains no messages? Take a look at Figure 41—it’s not pretty.

Figure 41. Viewing a topic that has no messages

To avoid having users see this type of page, you can use conditional regions to control what content is displayed and when. Dreamweaver 8 comes with a predefined set of conditional regions that help you hide or display content only when a condition is met—if a recordset is empty, if it is the first record in the recordset, and so on. In addition to this set, ImpAKT offers a set of conditional regions—if a user is logged in, if a file exists or a field has changed.

The message list elements must be displayed only when messages exist for the selected topic. To enforce this behavior, you will use the Show If Recordset Is Not Empty server behavior:

1. Select the <div.content> tag from the tag selector.

2. Apply the Show If Recordset Is Not Empty server behavior from the Server Behaviors tab > Plus (+) > Show Region (see Figure 42).

   

   

   Figure 42. Applying the Show If Recordset Is Not Empty server behavior

3. In the Show If Recordset Is Not Empty dialog box, configure the user interface to use the rsMessages recordset.

4. Click OK to apply the server behavior. A gray border labeled “Show If…” appears around the message details (see Figure 43).

   

   Figure 43. Gray border surrounding the message details

   Now if a topic without messages is selected, the page will no longer look broken.

5. Add a message that tells users the topic is empty. To do that, place the cursor inside the content <div> tag, on the very last blank space. Press Shift+Enter to create a new line and type the following text: There are no messages in this topic yet.
6. Select the text you just entered and apply the Show If Recordset Is Empty conditional region (from the Application tab in the Insert bar).
7. In the displayed dialog box, select the rsMessages recordset, as you did for the previous conditional region.
8. Click OK to apply the conditional region.

   Now if you access a topic that has no messages, the text you entered above is displayed (see Figure 44).

   

   Figure 44. A much nicer looking empty topic link

Finally, think of the following situation: Not all users might want to include a photo next to their name. If you display the messages from the Investment Opportunities topic, you’ll notice that Angel has not uploaded a profile photo (see Figure 45).

Figure 45. Default image indicating that an image has not been uploaded

In this case, a default image is displayed. To display no image at all, you have to apply another conditional region:

1. In Design view, select the image placeholder.
2. Select the Server Behaviors tab from the Application panel and click Plus (+) > MX Kollection > Conditional Regions > Show If File Exists. This will hide the default image (“Image not found”) for users who haven’t uploaded an avatar.

3. Configure the conditional region dialog box as follows (see Figure 46):

1. Select the folder that stores profile photos: profiles/
2. Select the recordset that displays the message information: rsMessages

3. In the Field pop-up menu, select the field that stores the filename: photo_usr



Figure 46. Show If File Exists dialog box

4. Click OK when done.

5. Save your page, upload it to the testing server, and preview it in the browser. It should look similar to Figure 47.

   

   Figure 47. Previewing the page with the new message functionality

Congratulations! The pages for displaying forum topics and messages are now completed.

Where to Go from Here

In this tutorial, you have learned how to connect to a database, pull data from your tables, and style it with CSS using Dreamweaver 8 and ImpAKT.

In Part 2 you will learn how to use the ImpAKT wizards and server behaviors to implement a user authentication system, create forms to post new messages or reply to existing ones, and notify subscribers of replies by e-mail.