143Web scaffolding for entities

Roo composes this tile fragment using the JSP tag page:list. This tag sets up the con-tainer for the next tag, table:table, which renders an HTML table of results. The results, coming from ${courses} in the controller, are rendered using table:column elements. All of these tags are available for review and editing in webapp/web-inf/tags.

The resulting output of the course listing view should be similar in appearance to figure 5.4.

As you can see, the results are paginated, with alternating grey and white bars for the rows. The list is wrapped with a box that’s entitled List all Courses, and if you click on the List all Courses drop-down arrow, it collapses the entire view. Icons are shown for various actions, which all result in further calls to methods in the course control-ler’s ITD. These icons are

 —Adds a new course. Displays a form that you can use to enter the data for the new course.

 —Deletes a course. Prompts the user before deletion.

 —Displays the course in a single-object view page. Useful for showing larger fields such as comments.

 —Updates/edits a course. Displays a form, populated with data values, that persists updates to the given course.

Clicking on any of these icons navigates to the other actions.

You should spend some time getting familiar with the custom tag libraries, such as list.tagx, table.tagx‚ and column.tagx. We’ll continue to customize the user inter-face as we go through the CourseController example.

Now let’s see how you can review an individual course.

SHOWING A SINGLE COURSE

If a user clicks on the icon for a given course in the web application, the browser navigates to another URL, passing the primary key as part of the path. If the key value selected is 42, the URL generated is /courses/42. The method mapped to this URL pattern is called show. Let’s take a look at it:

Figure 5.4 The course list view

@RequestMapping(value = "/ /courses/{id}

{id}", method = RequestMethod.GET)

public String CourseController.show(@PathVariable("id") Long id,

Capture

Model uiModel) { path

uiModel.addAttribute("course", Course.findCourse(id));

Fetch into

uiModel.addAttribute("itemId", id);

"course" return "courses/show"; Selected key

}

There’s a bit of interplay going on between this view and the list view in listing 5.5.

The list view’s table:table tag generates a table of results, each of which contains a link to edit an individual Course.

The show method, mapped to the /tasks/{id} URL pattern, takes the course pri­

mary key from the incoming URL path directly after courses/ and places it in the show method as the parameter id. Then it retrieves a course using the Course.find­

Course(id) entity method, storing the result in the Model as course, which will be ref­

erenced by the JSP view below.

The show method returns the value courses/show, which resolves to the view file in the WEB-INF/views/tasks directory named show.jspx. The following listing reviews this file.

Listing 5.6 Showing a single course with show.jspx

<?xml version="1.0" encoding="UTF-8" standalone="no"?>

<div xmlns:field="urn:jsptagdir:/WEB-INF/tags/form/fields"

xmlns:jsp="http://java.sun.com/JSP/Page"

xmlns:page="urn:jsptagdir:/WEB-INF/tags/form" version="2.0">

<jsp:directive.page contentType="text/html;charset=UTF-8"/>

<jsp:output omit-xml-declaration="yes"/>

<page:show id="ps_org_rooinaction_..._model_Course" Uses show tag object="${course}"

The page looks similar to the list view above, but you’ll notice that the page is now sur­

rounded by a page:show tag, and that each field is no longer rendered by table :column, but by a field:display tag. This form is rendered as a read-only view of a single Course. Roo automatically shows this view if you click on the icon for a given row in the list view, or once you create or update a row using the Create New Course menu item or click the icon.

Of course, it would be rather difficult to list or show tasks without actually creating one. Let's see how to create a Course, using the HTTP POST operation.

Web scaffolding for entities 145

5.3.3 Creating a new course

Spring MVC follows a very specific pattern for form-based processing, illustrated in

Figure 5.5 Creating a resource with form processing

As you see above, creating new entities requires first the display of a form that can edit the data. To create a new empty Course and edit it with the form, users would select the Create New Course menu item, which requests /courses?form. This URL maps to the createForm controller method in the Course_Roo_Controller.aj ITD:

@RequestMapping(params = "form", method = RequestMethod.GET) public String CourseController.createForm(Model uiModel) { uiModel.addAttribute("course", new Course());

return "courses/create";

}

The params = "form" code in the @RequestMapping annotation is what makes Roo map this form using /courses?form. In this method, Roo calls the new Course() con­

structor to create a single Course entity instance. This instance is then added to the model map as course and the JSPX Tiles view rendered is courses/create, which ren­

ders the view fragment located in WEB-INF/views/course/create.jspx, as shown next.

Listing 5.7 Creating a new course with create.jspx

<?xml version="1.0" encoding="UTF-8" standalone="no"?>

modelAttribute="course" path="/courses"

render="${empty dependencies}"

z="1dbo16WMREluRULwzHVH0bkl1Rs="> Editable TextArea <field:textarea field="name"

id="c_org_rooinaction_coursemanager_model_Course_name"

required="true"

z="yGVxN/bavsqgDzN24/udCm+MpYw="/>

<field:textarea field="description"

Roo generates a fully functional HTML form page. The HTML form tag is generated by the <form:create> tag, which establishes that the form will be submitted using the POST method to the URI /courses.

Users with JavaScript-capable browsers will see the automatic rich field generation, including date pop-ups for date fields, and automatic rule validation. Try clicking in a field, and entering invalid data. Experiment with skipping required fields. You should get feedback from the web page immediately upon leaving the field.

There are several field types used in the form above. Table 5.3 lists the field types available in the Roo tag library.

Editable

147