Highlighting Changes

Highlighting data changes or updates is another Ajax effect that can add considerable polish to an application. In Chapter 4, we saw this demonstrated when new comments were added and a yellow fade was used to highlight the new comment after it was saved.

This type of "fade and update the page" effect can also be used when an item is deleted. Rather than a yellow fade, a red fade could be used to differentiate this type of modification, or any color, really, as long as it differs from the "positive" or "additive" change.

Signaling a Deletion

Most deletions involve removing an item from a list. The item may be singular, such as a city in a list of cities. Or it can be a grouped item, such as a record from a database. Two components of the Ajax deletion are the fade, which signals the change, and the update, which shows the page with the item removed.

Sites such as Netflix and Blockbuster provide an ability to delete an item from a list, but with Netflix you have to check the item and then do a form update. Blockbuster provides a little garbage can that you can click, which triggers a delete and page update.

In applications like WordPress, you can delete a post by clicking a Delete link, which then triggers the deletion of the post and all associated records. Flickr also has a Delete link, which removes a photo.

A deletion should never be accomplished with a GET request; at a minimum you'll use the POST HTTP request if you can't use DELETE. It's not unusual to have ...

Get Adding Ajax now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.