How to Create an Ajax Autocomplete Text Field: Part 2 / Page 3 | WebReference

How to Create an Ajax Autocomplete Text Field: Part 2 / Page 3


How to Create an Ajax Autocomplete Text Field: Part 2 [con't]

Creating an Autocomplete Text Field Using the Eclipse Web Tools Platform

Add the Getters

We'll need some getters to retrieve the field values. We have to access that second popup menu again, but rather than right click the source code, we'll simply type "Alt+Shift+S" to access the "Source" menu directly. Use the down arrow to scroll to the "Generate Getters and Setters..." item and the "Enter" key to select it.

The "Generate Getters and Setters" dialog looks a lot like the "Generate Constructor using Fields" because it also uses the private class members to generate the methods. We'll click on the "Select Getters" button because we aren't interested in setter methods. This time, we will choose "Last method" for the insertion point because we don't want anything before the constructor (See Figure 17).

Here's the code that appears under the constructor after you click on the OK button:

Generate Delegate Methods

We also need a couple of convenience methods to convert from the internal format to something more useable in the Web pages. For that, we use the "Generate Delegate Methods" command. A delegate method is one that passes the actual work on to another object. In our getters, the delegate is the Object whose type we are storing in the member variables. For example, we would like to return the price as a double to the Web pages since primitive data types are a lot easier to work with. To accomplish this, we create a method using the same name as the BigDecimal's toDouble() method and call it from our method.

The "Generate Delegate Methods" command is on the same menu as the "Generate Constructor using Fields" and the "Generate Getters and Setters" ones. Again, type "Alt+Shift+S" to access the "Source" menu and use the down arrow and Enter key to select the "Generate Delegate Methods..." command. On the "Generate Delegate Methods" dialog, the first variable "lastUpdate" should be expanded to reveal a list of methods to choose from. Select "getTimeInMillis" and "getTime" under the "lastUpdate" variable. Expand the "price" variable and locate the "doubleValue" method to select it. Make sure that the insertion point is "Last method" and click the OK button to add the two methods (See Figure 18).

You will now see the doubleValue() and getTimeInMillis() methods in your class:

To make the getTimeInMillis() method name more descriptive, change it to getJsonDate(). The getTime() method was used to give us a loose framework to work with. It should be called getLastUpdateString() because we'll be using it to display a formatted date in the Web page. Although the getTime() method of the GregorianCalendar class is final, ours is not, so you can remove it and change the return type to a String. Add code to the method body so that the Date object is converted to a formatted medium date String:

Save the class to build it and verify that there are no errors. Remember that you can display the error message by hovering over the "X" icon on the left of the offending line and you can click it to display a list of possible solutions.

The Big Picture

In a Model-View-Controller multi-tiered framework, we've completed the Model component. In the next installment, we'll be building the Servlet, which will be our Controller. In subsequent installments, we will focus on the client-side, where the JavaScript and CSS will handle the View part, by making our Autocomplete text field look and behave as it should.


Original: April 3, 2008 Digg This Add to