Chapter 3. Introducing Prototype

The last chapter started by introducing Ajax without library support, then explored how Prototype can help, and ended with a taste of Rails’ helpers. In this chapter, along with Chapters 4 and 5, we dive deep into Prototype and its helpers—from the simplest links to full-blown interactive components with visual effects. This chapter focuses on the helpers that interact with Prototype to create Ajax-enabled links and forms. For a full reference to all of Prototype’s capabilities, see Chapter 10.

Setting the Stage

For the examples in this chapter, we’ll reuse the Rails application created in Chapter 2, but we’ll generate a new controller. So back to the command line:

script/generate controller chapter3 get_time repeat reverse

That command generates a controller chapter3 with four actions: index, get_time, repeat, and reverse. Take a look at http://localhost:3000/chapter3 and you will see a bare-bones view, as in Figure 3-1.

New controller
Figure 3-1. New controller

In the previous chapter, we kept the example views as plain as possible. This time let’s spruce it up a bit with an HTML layout and a CSS file. First create a new layout file, app/views/layouts/application.rhtml, and fill it with a basic XHTML template:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" ...

Get Ajax on Rails 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.

Start your free trial