Ajax programming with Struts 2

显示全部楼层 · 2017-9-26 13:06:30

Ajax developers know that tables can do a lot more than display static information in an organized, readable format. By syncing up your table rows with a server-side database, you can create dynamic tables that sort, filter and paginate data on the fly. In this article, Sun Certified Java Developer Oleg Mikheev shows you how to use Struts 2, Dojo and JSON to display server-side data in an Ajax-style table. In the process, he introduces some of the Ajax-friendly features of Struts 2, including its integration with WebWork, Guice and the Dojo toolkit.

千问 · 2017-9-26 13:06:30

Almost every Web application incorporates tables, and Ajax-style Web apps are no exception. Tables in Ajax applications can't just display information like they would in any old Web app, however: Ajax implies dynamic filtering, sorting and pagination. There are many solutions for addressing dynamic, tabular functionality on the client side, but this approach doesn't satisfy most project requirements. Dealing with hundreds of records on the client is too complicated a task for even a modern processor. More important, in an Ajax application the data is expected to be always in sync with the current database state.

千问 · 2017-9-26 13:06:30

Several Ajax solutions simplify Ajax programming by converting server-side Java code into JavaScript, but at the cost of flexibility. Most developers don't want to be restricted by the dictated programming model and limited number of components these frameworks provide.
Given the options, creating a custom Ajax table really is your best choice. In this article I propose a custom solution that works and I show you how to implement it using Struts 2. Along the way, you get a quick tour of some of the frameworks within the framework that is Struts 2 -- namely OpenSymphony WebWork/XWork, Guice and Dojo -- and find out how Struts 2 integrates these powerful allies to make Ajax development a pleasure.

千问 · 2017-9-26 13:06:30

If you need an immediate solution to the problem of displaying server-side data in an Ajax application, cut to the quick list. You'll get a five-step solution with code samples you can use today. If you're more generally interested in Ajax development, or want to learn about Ajax support in Struts 2, then read on.
Note that this article assumes you are conceptually familiar with Ajax development. Experience with Struts 2, Dojo and JSON is helpful but not required.

千问 · 2017-9-26 13:06:30

Creating dynamic tables
Ajax support in Struts 2
Struts 2 combines the best open source frameworks available to ease Ajax development. To control webflow on the server side it utilizes OpenSymphony WebWork/XWork. For dependency injection without the configuration headache it uses Guice. On the client side it utilizes Dojo, the JavaScript toolkit. Struts 2 also supports JSON, a subset of JavaScript whose abbreviated syntax makes it better suited to data interchange than XML.
A typical Ajax table -- that is, one whose data is dynamically filtered, sorted and paginated -- must receive two pieces of information from the server for every instance of data display: records comprising the single current page of data, and pagination data. The records are taken from the sorted and filtered whole data set. The paging information consists of the current page number and total number of records in the data set after filtering. Let's call the first one getRows and the second one getRowCount.

千问 · 2017-9-26 13:06:30

Passing contextual data
Both getRows and getRowCount require contextual information, such as what page number is being requested, what column to sort by and how to filter the
requested records. The total number of records doesn't depend on sorting and pagination, so getRowCount only needs to know the filtering criteria. A Map is a simple but sufficient container for this information. Map keys are field names and Map values are criteria field values. getRows additionally needs to know which page number to display and how to sort the data. The Java bean in Listing 1 holds contextual
information to be transported from and to getRows and getRowCount.

[url=]Listing 1. Java bean to transport pagination, sorting, and filtering data[/url]
public class SortedPagedFilter {
private byte direction; // direction of sorting
private String field; // field to sort by
private Map criteria; // filtering criteria
private int page; // current page
// accessors omitted
}

千问 · 2017-9-26 13:06:30

Retrieving contextual data
Most ofyour effort will be spent on coding the logic to return contextualinformation from the database. You probably are aware of the varioustechniques for getting a paged record set from a database. If you'reusing the Java Persistence API (via a JPA persistence provider likeHibernate 3) you can instruct its Query interface to return a page using setMaxResults and setFirstResult.Your JPA implementation should support a JDBC driver capable ofhandling your database capabilities. It should also be advanced enoughto know how to issue an SQL query that will actually return the exactnumber of records for a given page. In this case your work is done.Unfortunately, in some cases setMaxResults and setFirstResult will only mimic the expected behavior. These calls will actually transport the entire recordset from the database, cutting
off redundant records at the JVM.

Forapplications with many database records, there is a good chance youwill need to write an SQL query native to your application database. Ifyou are using ORM (object-relational mapping) you will have to retrievea list of native object IDs, which you will later use in yourORM-specific query to retrieve the list of entities. For JPA it willlook something like:

select o from Order where o.id in (3,6,21,30)
If you are not using ORM, POJO beans will be populated using the same approach manually.

Once you've retrieved the actual page data from the server (getRows) getting the pagination data isn't a big deal: a simple SQL query is enough to retrieve a count of rows with a filter applied.

千问 · 2017-9-26 13:06:30

Setting up the JSP page
Your server side is ready to go and it's time to prepare the display to render all of your gathered data into a table. The first thing you need to do is import the required Dojo components, as shown in Listing 2.
Listing 2. Initializing required Dojo components

千问 · 2017-9-26 13:06:30

Dojo's FilteringTable component is capable of displaying data in JSON (JavaScript Object Notation) format. Of course its look and feel is completely customizable with CSS. Your table definition should include headers only, with the field property set to the property to display, as shown in Listing 3.
Listing 3. Table definition
multiple="false" alternateRows="true" valueField="id">

ID
First Name
Second Name

千问 · 2017-9-26 13:06:30

Note that FilteringTable was created to filter and sort data on the client side. You'll need to disable this functionality in order to proceed with filtering and sorting on the server side, as shown here:
var yourTable = dojo.widget.byId('yourTableId');
yourTable.createSorter = function() { return null;};
You now have two pieces of information (first name and second name) on the client side formatted as JSON strings. It's a good time to think about how you will transport the data between server and client.
Using Dojo and JSON for data transport
Many JavaScript-to-Java RPC solutions are available, most notably DWR. Struts 2 actually cuts out the need to for third-party libraries because it comes bundled with Dojo, which has RPC built in. What's more, the JSON plugin for Struts 2 automatically converts JSON-formatted strings to Java objects.