A Display File's DDS source is migrated by Monarch to an .aspx web page, and by default command keys are rendered as buttons. This article shows how migration developers can design a richer, more attractive interactive presentation by employing various Monarch 3.0 and ASP.NET features.

When and commona button is clicked (or the corresponding function key is pressed), the Attention Identifier (IBM AID Key) is elicited. As Function keys and Attention keys, they can be conditioned by program indicators and in turn communicate to the program logic via user defined indicators (*IN01, *IN02 ...), predefined function key indicators (*INKA, *INKB ...), and finally by the AID byte. By default, the button's width is variable and is a function of the length of its text.



Typical command key button layout.

Display Command Buttons Vertically

Command buttons may be displayed horizontally (either top or bottom of page) or vertically. Frequently developers prefer a fixed width for each button for better appearance. To achieve the look shown below, the Monarch DdsFile server control is placed into its own HTML division to allow the application content to remain in context. Note the appearance of the ButtonPanel division is externally driven by the application's Cascading Style Sheet (CSS). Because all of this can be included in the Monarch template files, every display file that is migrated will have the new appearance. And, if the user wants a different look, merely change the CSS.

Use Images for attractive Command Buttons

Attractive buttons can be easily created using images as the background to the standard DdsFile buttons. Below illustrates the simple modification the CSS style for the command keys style that sets the image as the buttons' background and sets a constant width for all command key buttons (DdsKey style). Although not shown here, CSS styles can be set for individual command key buttons, as well.

Use Your Own Buttons for Command Buttons

The Hidden property of the DdsFile server control will hide all command buttons except for the Enter and Reset buttons (which can also be hidden by CSS style settings). Hiding the command buttons has no affect on functions keys F1 though F24 - they operate just the same. This feature provides the opportunity to provide buttons, links, images, anything that can be clicked to give the user a richer interface to drive the application.

Using Web controls in lieu of command buttons is accomplished without any modification to the original program logic. This is possible because the JavaScript functions built into the Monarch framework that emulates the pressing of the function keys and clicking command buttons. As illustrated below, all that is needed is to execute the pushkey JavaScript function passing the name of the key as the argument.

There's More!

This article has introduced just some of the features of Monarch and ASP.NET that enable providing a richer user experience. Look for future articles to show how well ASP.NET features such as Themes, Skins and Master Pages work with Monarch migrated applications.

----

Making your own custom buttons is easy and inexpensive

Downloadable software packages and even online services are available to easily create your own exciting and modern web buttons. Here are a couple of resources to consider:

ButtonMaker.com Resource for Web developers
ButtonGenerator.com Online button generator