Developer > General

Using EGL to Build AJAX Apps

After a couple of questions from readers of previous articles, I really wanted to write a great article about Enterprise Generation Language (EGL) and asynchronous JavaScript* and XML (AJAX). I wanted some excitement, some sizzle and even some adventure. My goal from the outset was to see just how good the AJAX implementation was, so I decided I'd try to use the tool without the benefit of formal training. That was the right decision, since EGL's support for AJAX is so cutting edge that not a lot of introductory documentation is available yet. Don't get me wrong; the reference material is quite good, it's just the EGL/AJAX 101 stuff that isn't readily available. And even that should be remedied soon; IBM's EGL architect and software development engineer Jon Sayles' education session, which I saw only after slogging my way through on my own, is good, and I hope it'll soon become a public tutorial.

Documentation aside, the question remains: Does EGL let you build real AJAX applications? And by "real," I mean something a little more complex than a country-code dropdown. The answer is a resounding yes! IBM* Rational* Business Developer Extension (RBDe) can help anyone design an attractive Web page, but the AJAX support in EGL makes it easy to put powerful logic behind those pretty pages.

One word of caution: Unlike what you might expect from me, this isn't an RPG article. This is purely AJAX and EGL. The data for the application came from DB2* on my System i* platform, but the application itself used a standard Java Naming and Directory Interface* data source to connect to the database. This caused some hiccups and serious early-morning head pounding, but I'll leave that for later. For the purposes of this article, though, it means I did all my work without any RPG code.

An Exhausting but Productive Weekend

A tough weekend and several wee hours went into this project - and all without my trusty RPG code. So what do I have to show for it? I created a multilevel, point-and-click, drilldown application that provides subsecond response time using data from a System i server - all without a line of Java* and only a few lines of JavaScript. Let's take a look at the finished product in Figure 1.

This is a three-column application. The left column is a customer work-with display consisting of two panels; the top panel shows a list of customers and the bottom panel shows the details of the selected customer. Select a customer by simply clicking on it. The second column is a work-with for the orders for the selected customer. Again, the bottom panel is the detail of the line selected in the top panel. And the third column is the work-with for the lines of the selected order.

The customer panel is completely interactive: Click on "Reload Customers" and the entire panel is refreshed. All customers are read and shown in the list, and the first one is selected. The details are shown in the bottom panel. The orders panel is loaded for that first customer, and the first order is selected. The lines panel is loaded for that first order, and the detail for the first line is loaded. Each of the list panels is clickable. Click on an order and the order detail panel is updated, as is the entire third column. Click on a line and only the order line detail in the lower right panel is updated. When you click on a customer, the whole process is repeated for that customer - loading the customer information, orders and order details.

It's really not a bad little drilldown. Just add a few style-sheet enhancements and maybe some graphic icons indicating "hot" customers, and you've got yourself a dashboard.

IBM Rational Business Developer Extension can help anyone design an attractive Web page, but the AJAX support in EGL makes it easy to put powerful logic behind those pretty pages.

Next page: >>