ASPX Components and Layout

In this split view the IBM input field has been selected (marked in light blue) in the design view and the corresponding web control is highlighted automatically in the source view.

From this we can tell the type of field by the CssClass, its length, whether it is lower case, positioning on the form, alias name, input/output usage, virtual position, and width.

You can also see the constant "System" definition within the red rectangle. It has less information (meaning that the particular constant it refers to will primarily use the defaults for DdsConstants) but nonetheless defines the position, text value, and CssClass. Another key fact is that the form uses a master page "MasterPage.Master" noted with the green arrow. You can find more on Master Pages here.

ASPX Display File

ASNA Mobile RPG uses controls that are distributed in a .NET assembly called ASNA.Monarch.WebDspF. These ASNA Monarch Web Display File controls are usually referred to as ASNA Controls. They can be added to a Mobile page from the ASNA Controls tab in the Visual Studio Toolbox. They're listed in the following table.

The Monarch Web Controls are registered to the Web Form using the prefix "mdf" (Monarch Display File), such that instances of the controls can be added to the markup, using the following tag syntax:

<mdf:dds_control_class_name
    id=unique_id
    runat="server"
    Alias=rpg_name
    Property1=property_value1
    Property2=property_value2
    Property3=property_value3
      . 
      . 
/>    

where,

The following is just a partial view of an .aspx file created showing just the ddsfile definition in the file.

<asp:Content ID="FileContent1" runat="server" ContentPlaceHolderID="FKeyPH"	
  <div id="Div0">  
    <mdf:ddsfile id="CUSTDSPFControl" runat="server" 
      FuncKeys="F3 'Exit' 03;"
      BannerStyle="Vertical"
      DisplayErrorMessages="False"
      SrcDdsCcsid="37"  />

  </div>
</asp:Content>

The Mapping between DDS entries and the Monarch Web Controls is automatically performed during the import process but programmers will want to familiarize themselves with their syntax as reference for further modernization and maintenance of the application.

There are some common properties that the developer should become familiar with in order to be proficient while maintaining the modernized application.

• Style
  This is an HTML standard property or attribute that defines a collection of rendering styles. Most instances of Monarch Web Controls will use this property to define the element's position on the Page using POSITION as an absolute point with a certain number of pixels starting from the left of the Page and certain number of pixels starting from the top of the page. The style's value-pairs are given as a double-quoted string with a collection of keyword and corresponding value; each separated by semicolons. An example follows.

  style="POSITION: absolute; LEFT: 19px; TOP: 0px;"

  The above example defines three style properties:, POSITION, LEFT, and TOP; with values: absolute, 19px, and 0px respectively. This collection of styles positions the control exactly at coordinate 19,0 where the numbers are given in device pixels.
• CssClass
  This Monarch Web control property defines the Cascading Style Sheet (CSS) style name to be used for this control. These styles, in file Framework.css, are found in the folder ~/Themes/Current. CSS is a standard HTML mechanism to externally describe visual styles, such as color, font, margins etc. The value for this property is a string that corresponds to the name of the cascading style. By default the import process will assign a style name that matches the name of the control, that is, all DdsCharField controls will use definitions beginning with "DdsCharField", all DdsConstant controls will use definitions beginning with "DdsConstant". Furthermore, in the case of input control, the runtime engine will append the following names to the CssClass name to allow more granular rendering. Note that not all CSSClass names will use all of the following list. See ASNA Mobile RPG Cascading Style Sheets for more detail.
  
  • _Error
    If the entry is found to be invalid after validation, the control will re-paint using the CssClass with the _Error appended to the name.
  • _OutputOnly
    For output-only usage, the controls will use the style defined by the CssClass with the _OutputOnly appended to the name.
  • _Right
    For right justified usage, the controls will use the style defined by the CssClass with _Right appended to the name.
  • _Right_Error
    If a right justified field entry is found to be invalid after validation, the control will re-paint using the CssClass with the _Error_Right appended to the name.
  • _Right_OutputOnly
    For output-only usage on a right justified entry, the controls will use the style defined by the CssClass with the _Right_OutputOnly appended to the name.
• ContentPlaceHolderID
  This Monarch Web control property defines the placement of content data within the corresponding sections of the MasterPage.master file. Note that not all aspx pages may use all of the following list.
  
  • HeaderPH
    The top of the display form for the heading.
  • FKeyPH
    A section for any special menu functions and the active function keys that are to be displayed.
  • CenPH
    The main content section where the majority of the user interaction occurs.
  • MsgPH
    A single line under the main content for messages to the user.
  • PageScriptPH
    Placeholder for JavaScript content such as for entries on the menu bar, resetting default color schemas, and other macros.
• Alias
  This Monarch Web Control property defines the name of the associated RPG field used by the RPG program. Note how this is different from the standard HTML id property. The Alias property accepts values as quoted strings with RPG symbol names, which allows characters that are valid in RPG but that are not necessarily valid as HTML id names. Should you ever rename a field in the RPG program that uses a particular Web Form that was imported from a DDS, the corresponding change needs to be done to the "Alias" property so that the proper control will represent the field on the Page the next time the application runs.
• VirtualRowCol
  This Monarch Web Control property defines the legacy DDS position of the element. When the Display file is imported, the legacy DDS row and column positions are converted to pixel coordinates. The new pixel positions may change as the Web Form is modernized but it is important that the original row and column be preserved. This is necessary because the RPG code - such as that related to the RTNCSRLOC keyword - still depends on these legacy values. The legacy positions are known to Monarch as the "virtual" positions.