DAW DG v5 0 0 1 Development Guide

AX Anywhere Framework
Development Guide
File : DAW DG v5 0 0 1 Development Guide.docx

Author(s) : Jrre Holland, Johan Mulder
Last edited by : Jrre Holland
Create Date : 20 January 2010
Modify Date : 16 August 2013
Revision : 5.0.0.1
2013 Dynamics Anywhere. All rights reserved. The names of actual companies and products mentioned herein may be the trademarks
of their respective owners.
www.dynamicsanywhere.com
1. Development Guide
1.1 Summary
Product : Dynamics Anywhere AX Anywhere Framework
Release Version : R4
Description : This guide explains how the Dynamics Anywhere Framework for Dynamics AX
works, and how a developer can use it to create or modify a mobile
application for the framework.
1.2 Revision history

Rev Date By Description
1.0.0.0 20 January 2010 Jrre Holland Initial version.
2.0.0.0 3 November 2010 Jrre Holland This document has been revised to reflect the
changes made to the framework for R2. The
hands-on assignments have also been updated,
and a section on active sessions and parameters
has been added.
2.0.0.1 18 March 2011 Jrre Holland Minor updates.
3.0.0.0 25 May 2011 Jrre Holland New chapters have been added on When to use
Always Create and Create or Return with
Showform, Authorization: Roles and Processes,
Exporting and Deploying a Mobile Application.
Some details around the DAWFW Parameters
have been moved to the new Maintenance
Guide.
3.0.0.1 29 September 2011 Ralph Peters DAW Framework is now referred to as
AX Anywhere Framework.
4.0.0.0 11 July 2012 Johan Mulder The document has been revised due to the R4
framework enhancements.
4.1.0.0 11-12-2012 Jrre Holland / Small revision to beter fit new designer layout.
Rajesh Bongu Added section on use of style sheets.
5.0.0.0 23-7-2013 Jrre Holland Updated screenshots, other improvements.
/Rajesh Bongu
5.0.0.1 16-8-2013 Jrre Holland Added section describing setting of multiline
height and button background images.
1.3 Who Should Read This Guide?
This guide is aimed at developers planning to create or modify a mobile application, or consultants planning
to make minor modifications to existing mobile applications.
A good general knowledge of Dynamics AX, as well as the development environment and X++ syntax is
required.
1.4 What is discussed in This Guide?

The following subjects are discussed in this document:
An overview of the Framework
The framework data model
Creating or modifying a framework application
Configuring behavior and navigation
Events and the application and forms classes
Adding validation and registration to submits
Fine tuning navigation and mobile application behavior from code
Creating pop-up style dialogs
Filling grids and selecting data
Table of contents
1. DEVELOPMENT GUIDE ............................................................................................................................................... I
1.1 SUMMARY ....................................................................................................................................I
1.2 REVISION HISTORY ..........................................................................................................................I
1.3 WHO SHOULD READ THIS GUIDE? ................................................................................................... II
1.4 WHAT IS DISCUSSED IN THIS GUIDE? ................................................................................................ II
2. FRAMEWORK OVERVIEW ......................................................................................................................................... 1
2.1 INTRODUCTION ............................................................................................................................ 1
2.2 THE FRAMEWORK WITHIN AX ........................................................................................................ 2
2.3 ON SESSIONS ............................................................................................................................... 3
3. THE APPLICATION CONFIGURATION DESIGNER ......................................................................................................... 4
3.1 THE APPLICATION CONFIGURATION - APPLICATION ............................................................................ 4
3.1.1 Application object layer within framework data ............................................................. 5
3.1.2 Application properties ..................................................................................................... 5
3.1.3 Menu properties .............................................................................................................. 5
3.1.4 Label properties ............................................................................................................... 6
3.1.5 Application variables properties ...................................................................................... 6
3.1.6 Application specific actions.............................................................................................. 7
3.2 THE APPLICATION CONFIGURATION - FORM ..................................................................................... 7
3.2.1 Form properties ............................................................................................................... 8
3.2.2 Form variables properties ................................................................................................ 8
3.2.3 Form specific actions ....................................................................................................... 8
3.3 THE APPLICATION CONFIGURATION CONTROL ................................................................................ 9
3.3.1 Control properties ............................................................................................................ 9
3.3.2 Data grid column configuration..................................................................................... 11
3.3.3 Device/Localized specific information configuration ..................................................... 12
3.3.4 Button actions................................................................................................................ 12
3.3.5 Linked Variables ............................................................................................................. 15
3.3.6 Control specific actions .................................................................................................. 16
3.4 FORM DESIGNER (BETA) ............................................................................................................. 16
3.5 THE APPLICATION CONFIGURATION FRAMEWORK TAB ................................................................... 17
3.6 THE APPLICATION CONFIGURATION STYLE SHEETS TAB ................................................................... 18
4. A CASE: HELLO WORLD PART 1 ............................................................................................................................... 19
4.1 CREATING A NEW APPLICATION..................................................................................................... 19
4.2 ADDING FORMS TO YOUR APPLICATION .......................................................................................... 21
4.2.1 Create the hello world form ........................................................................................... 21
4.2.2 Configuring the logout form .......................................................................................... 22
4.3 TESTING THE APPLICATION ........................................................................................................... 24
5. CUSTOMIZING THE GENERATED APPLICATION AND FORM CLASSES ....................................................................... 26
5.1 INTRODUCTION .......................................................................................................................... 26
5.2 RESPONDING TO USER SUBMITS (BUTTON AND KEY PRESSES) ............................................................. 27
5.3 INITIALIZING OBJECTS WHEN THE FORM LOADS ................................................................................ 28
5.4 RESPONDING TO USER INPUT FROM A PREVIOUS FORM ..................................................................... 28
5.5 AN OVERVIEW OF OTHER FORM EVENT METHODS ............................................................................ 29
5.5.1 OnControlCheckedChanged ........................................................................................... 29
5.5.2 OnControlSelectedIndexChanged .................................................................................. 29
5.5.3 OnControlTextChanged ................................................................................................. 29
5.5.4 OnDeactivate ................................................................................................................. 29
5.5.5 OnInit ............................................................................................................................. 29
5.6 AN OVERVIEW OF APPLICATION EVENT METHODS............................................................................. 30
5.6.1 Onload ........................................................................................................................... 30
5.6.2 OnLogoff ........................................................................................................................ 30
5.6.3 OnMenuSelect................................................................................................................ 30
5.7 RESPONDING TO EVENTS IN GENERAL, CALLING EVENT METHODS EXPLICITLY FROM CODE ....................... 31
6. A CASE: GETTING SOME ITEM INFORMATION ......................................................................................................... 32
6.1 ADDING THE FORMS IN THE APPLICATION CONFIGURATION ................................................................ 32
6.2 CREATE A FORM THAT DISPLAYS THE RESULT ................................................................................... 34
6.3 ADDING SOME CUSTOM CODE TO YOUR APPLICATION ....................................................................... 36
6.4 TESTING YOUR MODIFICATIONS .................................................................................................... 37
7. THE TRANSACTION LOG .......................................................................................................................................... 38
7.1 INTRODUCTION .......................................................................................................................... 38
7.2 CLEANING UP THE TRANSACTION LOG ............................................................................................ 38
7.3 DEBUGGING THE APPLICATION...................................................................................................... 39
7.3.1 Notes on application state ............................................................................................. 39
7.3.2 Breaking your code with a throw so you can debug...................................................... 39
7.3.3 Debugging your code ..................................................................................................... 41
8. A CASE: SHOWING INFORMATION IN A DATA GRID ................................................................................................ 43
8.1 ADDING A NEW FORM TO THE DESIGNER ........................................................................................ 43
8.2 ADDING CODE TO LOOK UP THE ITEM ............................................................................................. 45
8.3 SETTING UP THE DATA GRID ......................................................................................................... 46
8.4 NAVIGATE TO THE NEW FORM ...................................................................................................... 46
8.5 TEST THE MODIFICATION ............................................................................................................. 47
9. MANIPULATING THE FRAMEWORK THROUGH CODE .............................................................................................. 48
9.1 METHODS OF THE APPLICATION CLASS ........................................................................................... 48
9.1.1 About the application class............................................................................................ 48
9.1.2 Getters for form classes ................................................................................................. 48
9.1.3 Getters/setters for variables .......................................................................................... 48
9.1.4 FindLabel ........................................................................................................................ 48
9.1.5 GetDeviceTypeId ............................................................................................................ 48
9.1.6 GetHostname and GetUserId ......................................................................................... 48
9.1.7 GetLanguageId .............................................................................................................. 48
9.1.8 Get/SetMainParam and Get/SetMainParamContainer ................................................ 48
9.1.9 Logoff ............................................................................................................................. 49
9.1.10 ReturnFromForm ........................................................................................................... 49
9.1.11 ShowFormByInstanceId and ShowFormByConfigId ....................................................... 49
9.1.12 ShowMainMenu............................................................................................................. 49
9.2 METHODS OF THE FORM CLASS ..................................................................................................... 50
9.2.1 About the form class ...................................................................................................... 50
9.2.2 Getters for user control classes ..................................................................................... 50
9.2.3 Getters/setters for variables .......................................................................................... 50
9.2.4 Get/SetFormParam and Get/SetFormParamContainer................................................. 50
9.2.5 GetHostname and GetUserId ......................................................................................... 50
9.2.6 Get/SetMainParam and Get/SetMainParamContainer ................................................ 50
9.2.7 IsReturnedFromForm ..................................................................................................... 50
9.2.8 PerformButtonNavigation ............................................................................................. 50
9.2.9 PerformOnFormSubmit.................................................................................................. 51
9.2.10 ReturnFromForm ........................................................................................................... 51
9.2.11 ShowForm ...................................................................................................................... 51
9.3 METHODS OF USER CONTROL CLASSES ........................................................................................... 51
9.3.1 About the user control classes ....................................................................................... 51
9.3.2 BoundDataCount (data grids only) ................................................................................ 51
9.3.3 BoundDataContainsField (data grids only) .................................................................... 51
9.3.4 CaptionCssClassId .......................................................................................................... 52
9.3.5 CaptionCustomStyleAttribute ........................................................................................ 52
9.3.6 Checked (checkbox only) ................................................................................................ 52
9.3.7 ClearBoundData (data grids only) ................................................................................. 52
9.3.8 CssClassId....................................................................................................................... 52
9.3.9 CustomStyleAttribute..................................................................................................... 52
9.3.10 FillFromList (data grids only) ......................................................................................... 52
9.3.11 FillFromQuery (deprecated) ........................................................................................... 52
9.3.12 GetBoundData, GetBoundDataStruct (data grids only) ................................................ 52
9.3.13 HasFocus and SetFocus .................................................................................................. 52
9.3.14 IsSubmitTarget (buttons only) ....................................................................................... 53
9.3.15 ListFields (data grids only) ............................................................................................. 53
9.3.16 ReportFilePath (report output only) .............................................................................. 53
9.3.17 SelectedIndex (data grids only)...................................................................................... 53
9.3.18 Text ................................................................................................................................ 53
9.4 USING THE SIGNATURE CAPTURE CONTROL ..................................................................................... 54
9.5 USING THE REPORT OUTPUT CONTROL .......................................................................................... 55
10. A CASE: REACTING TO RETURN FROM FORM RESULT VALUES ......................................................................... 56
10.1 AUTOMATICALLY CONTINUE AFTER SELECTING AN ITEM FROM THE LIST................................................ 56
10.2 ADDING CODE TO THE ONREACTIVATE METHOD .............................................................................. 56
11. CONFIGURING CSS AND STYLE SHEET FILES ........................................................................................................ 58
11.1 STYLE SHEET FILES THAT COME PRE-INSTALLED ................................................................................ 58
11.2 WORKING WITH STYLE SHEETS IN THE DYNAMICS ANYWHERE FRAMEWORK ......................................... 59
11.2.1 File location.................................................................................................................... 59
11.2.2 How to create a reference to a file (theme) .................................................................. 59
11.2.3 Device type specific themes ........................................................................................... 60
11.3 ADDING THE CSS CLASSES ........................................................................................................... 61
11.3.1 Adding and modifying.................................................................................................... 61
11.3.2 Default classes ............................................................................................................... 61
11.3.3 Combining classes .......................................................................................................... 61
11.3.4 Special note for data grids ............................................................................................. 62
11.4 SETTING THE THEME ................................................................................................................... 62
11.4.1 On application level ....................................................................................................... 62
11.4.2 On form level ................................................................................................................. 63
11.4.3 The log in screen ............................................................................................................ 63
11.5 SPECIFY THE CLASS ON A CONTROL ................................................................................................ 64
11.5.1 Menu items .................................................................................................................... 64
11.5.2 Form caption.................................................................................................................. 64
11.5.3 Controls .......................................................................................................................... 65
11.5.4 Specify a HTML attribute ............................................................................................... 65
11.6 CHANGING CSS AND HTML ATTRIBUTES DURING RUNTIME .............................................................. 66
11.7 MORE INFORMATION ON CSS FILE FORMAT AND HTML ATTRIBUTES .................................................. 66
11.8 SOME USEFUL CSS SETTINGS ........................................................................................................ 66
11.8.1 Adding a background image to a (menu) button .......................................................... 66
11.8.2 Setting the height of a multiline textbox ....................................................................... 67
12. A CASE: ADDING SIGNATURE CAPTURE .............................................................................................................. 68
13. AUTHORIZATION: ROLES AND PROCESSES.......................................................................................................... 71
14. SESSIONS AND SETUP......................................................................................................................................... 72
14.1 ACTIVE SESSIONS FORM .............................................................................................................. 72
14.2 FRAMEWORK PARAMETERS ......................................................................................................... 73
15. EXPORTING AND DEPLOYING A MOBILE APPLICATION ....................................................................................... 74
15.1 EXPORTING THE MOBILE APPLICATION .......................................................................................... 74
15.1.1 Setting up Data Export................................................................................................... 74
15.1.2 Creating an export group............................................................................................... 74
15.1.3 Exporting UI Data .......................................................................................................... 75
15.1.4 Exporting the code ......................................................................................................... 76
15.1.5 Store both exports together........................................................................................... 76
15.2 IMPORTING THE MOBILE APPLICATION .......................................................................................... 77
15.2.1 Importing UI Data .......................................................................................................... 77
15.2.2 Importing code............................................................................................................... 77
15.2.3 Setting the Layer for the UI Data ................................................................................... 77
16. NOTES ................................................................................................................................................................ 78
2. Framework overview
2.1 Introduction
Central to the AX Anywhere Framework is the DAWFW Mobile Portal. Utilizing Dynamics AX Business
Connector technology to connect to Dynamics AX, the DAWFW Mobile Portal carries Dynamics AX into the
mobile world. Designed specifically to work flawless with any mobile device, the DAWFW Mobile Portal
presents the user with an attractive, fast and reliable user interface. In addition, the user interface is
designed to make the most of the mobile device, providing a clutter free view of the application and making
full use of additional resources like barcode scanners and RF tag readers to improve user productivity.
The following figure shows the overall architecture and the components that constitute the Dynamics
Anywhere Mobile Business Solution:
AOS
HTML XML
.NET Business Connector
Microsoft Dynamics AX
DAWFW Mobile Portal
DAWFW Webservice
DAW Application DAW / Application

repository User interface
DAW FrameWork
Microsoft Dynamics AX Functionality

PDA
Many mobile devices have a limited implementation of their web browser due to their design and
configuration, making ordinary HTML based solutions unsuitable for use on a mobile device. The AX
Anywhere Framework will run on any device with a browser, and fully supports using multiple device types
and form factors simultaneously.
The system and hardware requirements for each component must be met before installing. When you have
determined that your host environment meets the requirements that are provided in the following topics,
proceed to the appropriate installation section.
This guide deals mostly with configuring and modifying applications built within the Dynamics Anywhere
Framework. For details on installation and configuration of the DAWFW Mobile Portal, DAWFW Web Service
and Framework in AX, please refer to the Installation Guide.
Development Guide 1
2.2 The Framework within AX
The Framework in Dynamics AX consists of two parts. The first part is the user interface, which exists as data
in Dynamics AX tables. The second part consists of additional extensions on the classes that are generated
automatically by the framework when the user interface is designed. These extensions are used to interface
with Dynamics AX business logic, allowing the developer to validate or query data, call Dynamics AX objects
to perform registrations, etc.
Business Logic (X++) AX Database
AX
business
logic AX
business
AX logic
business AX data
logic
Custom
Custom
extension
Application
Application Form
extension
Form
to
Extended
Extended Extended
to form
Extended
application
Dynamics Anywhere FW UI Config Form and

and default UI element
properties properties
User action Application
Application Form
Application Form
Form
Event UI
Session UIUI
Handler Session Element Application
Element
Element UI element
New screen and form
bound data
vars
Shown above is a diagram showing how the different parts work together, and how the framework interacts
with the rest of AX.
User actions are received from the DAWFW Mobile Portal (using the Dynamics AX Business Connector).
The event handler looks up the session that goes with the user/device (or instantiates a new one if the user
is logging in), and passes the event on to the Application or Form objects (for instance, a user scanning a
barcode in a textbox would result in a submit event being called on the form class object).
Classes are generated automatically for forms and application by the framework whenever an application or
form is added to the framework using the user interface designer, and are specific for that application or
form. As these classes exist in the AOT of AX, custom extensions of those classes allow the developer to
validate user input, register data, or call other AX business logic.
Furthermore, since most user interface objects created when designing the user interface of the application
will have a generated representation in the AOT, it is impossible to accidently reference an object that does
not exist, and developer tools like code completion help to quickly add and customize the mobile
application.
2 Development Guide
2.3 On sessions
Whenever a user logs on to the framework, a session is created for this user/device. The framework creates
this session using the configured application. The session represents the running instance of the
application blueprint. The data stored in the user controls and associated variables are specific to this
session, and separated from other sessions of other users that may be running simultaneously.
Storing this data in tables in AX instead of as part of the web session makes sessions state persistent. If a
device resets, or the web session is lost, or even the business connector session, the application state will be
preserved, and upon logging in, the application will continue where it left off.
Development Guide 3
3. The application configuration designer
Developers can use the designer to create or modify the user interface of a mobile application for the
Dynamics Anywhere Framework, and to design some behavior and navigation for the application. You can
find the designer by selecting DAW Framework from the main menu of Dynamics AX, and then selecting
Application Configuration.
The application designer is a tree view-based application. The tree view based designer is introduced in the
R4 version of the AX Anywhere framework application. The tree resembles the current applications, its forms
and its form controls designed and developed in AX Anywhere. The right side of the form shows the detailed
properties for the application, forms and controls.
The data in the designer is stored records in dedicated AX Anywhere framework tables. These tables are
prefixed with D2MFW. Records are stored and set to the current AOL and you can only modify records that
are set to the current AOL. If the record is set in a different AOL, editing the record will create a copy of the
record with the AOL set to the current layer. When rendering the user interface, the framework will use the
topmost AOL version of the record, so multiple parties can work on the user interface in the same way they
would on application objects in AX.
3.1 The Application Configuration - Application
The menus configured for

the selected application
Applications
Multi language labels in

the selected application
Application
variables available
throughout the
selected application
Records in the Application
Configuration mimic the AX
Application layer system.
specific actions
The application configuration screen in the context of an application contains a list of the applications
configured in the framework using a tree view. On the right side you will see the menu configured for the
selected application and the labels created.
Labels can be used on many objects in the framework, and allow the developer to create a single reference
to text that can be in several languages, and may be formatted for several devices (with abbreviations for
devices with small screens, and verbose texts for devices with large screens).
4 Development Guide
The application variables are maintained in the last grid of the application context. Variables are used to
store data in your session. Each session has its own personal set of variables, which other sessions have no
access to.
Whenever an application is created in the designer by adding a record to the Application Configuration grid,
a project called D2MFW_<project name>is automatically created in the AOT, together with a class named
<project name>Main. As forms are added to the mobile application, automatically generated classes for
these forms are also added to this project.
3.1.1 Application object layer within framework data

Records in the Application Configuration mimic the AX layer system. If you make a modification within the
designer, this modification will appear in the current application object layer. Keeping your modifications in a
separate layer makes importing updates much easier, as the updates will not interfere with the
modifications you made in the designer.
3.1.2 Application properties

Property Description
ApplicationConfigId Uniquely identifies the application (set during creation)
MenuID Main menu used by the application
TitleLabel An optional label with the application title (shows up above the menu)
Stylesheet theme Field to set the current theme for the entire application
Without a menu configured, the application will not display properly. Make sure youve define a menu with
at least one option, and reference this menu in the application properties.
3.1.3 Menu properties

MenuId Uniquely identifies a menu (which can contain multiple lines)
Linenum Line number
Jump to Form Reference to the form launched by selecting this menu option
Jump to Menu Reference to a submenu
Jump to Application Reference to another application
LabelId Id of the label to be displayed for this menu item
Process Id Checked against authorized processes for the user logging in.
If a user is not authorized for the specified process id, the menu option
is not displayed.
CssClassId CSS Class ID used by the menu button. Use this to set different
background images for buttons.
Hot Key Hot key (function key) assigned to the menu.
Include Hotkey in caption Show or hide the hotkey in the button caption.
See 11.8.1 for information on setting background images for buttons.
Development Guide 5
3.1.4 Label properties
Label id Uniquely identifies a text label (for multiple languages/devices)
Devicetype Id Device type
Language Id Language
Text Text to display on the specified device in specified language.
Label Actual text (useful for sys labels, read-only)
Each label should at least have an entry for en-us, as this is the language the framework uses when a label in
the language of the user cannot be found. If the en-us label is missing in this case, the framework could
behave erratically or crash.
A dropdown allows you to select an AX sys label for the Text property. If you use AX sys labels you only have
to provide an entry for en-us, it will be translated to the user language automatically. Alternatively you can
provide a label for a different language if you wish to override the sys label translation for that specific
language.
3.1.5 Application variables properties

Variables are used to store data in your session. Each session has its own personal set of variables, which
other sessions have no access to. This enables you to collect and store data throughout the process without
the necessity of custom tables or other mechanisms to store session data in.
Variables can be either global or local. Global variables are available through the generated class for
the application (named <application name>Main), and local variables are available through the generated
class for the form (named <application name><form name>). In the context of the application you can only
set up the Global variables.
Variable name Uniquely identifies this variable
Extended data type Associated AX extended data type
Default value Default value (based on the base type of the Extended data type)
Type Base type of the extended data type (read only)
6 Development Guide
3.1.6 Application specific actions
The bottom left corner shows actions which are specific for the current context of the tree. In the context of
an application, these buttons are shown.
Action Description
Create form Create a new form for the current application
Create group Create a new form group
Delete Delete the current application
Alternatively, these options are also available in the context menu of the application node in the tree view by
right clicking the name of the application in the tree.
3.2 The Application Configuration - Form
Properties of the
selected form
User interface elements
Local variables on
on the selected form
the selected form
Forms within the

selected application
Forms contain user interface elements (user controls), as well as local variables that are available through
the form class. Whenever a form is created, a class named <application name><form name>will be created
in the application project in the AOT.
Development Guide 7
3.2.1 Form properties
Form config id Uniquely identifies the form in the application
Title label id Reference to the label shown as the form title
Default button Button that is activated when the user presses the enter key
Form Header CSS Class Id The CSS Class ID for the form header title
3.2.2 Form variables properties

Local variables are available through the generated class for the form (named <application name><form
name>). In the context of an application form you can only set up the Local variables.
Variable name Uniquely identifies this variable
Extended data type Associated AX extended data type
Default value Default value (based on the base type of the Extended data type)
Type Base type of the extended data type (read only)
3.2.3 Form specific actions

a form these buttons are shown.
Action Description
Create control Create a new control for the current form
Copy form Copies or moves the form to a target form and/or application.
Remove form Removes the form
Design form Opens the form designer (See chapter 3.4 for more information)
Alternatively, these options are also available in the context menu of the form node in the tree view by right
mouse clicking the name of the form.
8 Development Guide
3.3 The Application Configuration Control
Variables can be
linked to controls
Properties for this user

control (varies depending
on control type)
Properties that may vary

for different device types
(or languages)
3.3.1 Control properties

Currently, the user controls available are labels, textboxes, buttons, checkboxes, data grids, literal HTML
texts, report outputs and signature capture controls, with several more planned to be implemented in the
near future. User control properties for the selected user control are displayed below the control
configuration grid, and can be modified. Only the properties appropriate for the control type are displayed.
The control properties are type-driven. This means that the properties depend on the type of control which
is currently selected. Underneath is a list of those possible properties.
Property: Append colon

Applies to: Label
Description: Append a colon after the text
Property: Append newline

Applies to: Label, Textbox, Button, Grid, Literal HTML, Checkbox, Signature Capture
Description: Append a line break after the control
Property: Button action

Applies to: Button
Description: Action to perform when button is selected
Property: Button action form ID

Applies to: Button
Description: When the button action performs navigation to a form, this contains the id of that
form
Development Guide 9
Property: Checked
Applies to: Checkbox
Description: Checked property
Property: Clear on load

Applies to: Label, Textbox, Grid, Checkbox
Description: Clears the control value upon loading the form (see 5.3)
Property: Clear on reactivate

Applies to: Label, Textbox, Grid, Checkbox
Description: Clears the control value upon reactivating the form (see 5.4)
Property: Data grid select

Applies to: Button
Description: When a grid is present on the form, this causes the data of the selected row on the
grid to be copied to any variables linked to the columns
Property: Get caption from EDT

Applies to: Label, Textbox
Description: Gets and displays a caption for the label or textbox from the extended data type of
the linked variable
Property: Hotkey
Applies to: Button
Description: Hotkey (function key) linked to control
Property: Include hotkey in caption

Applies to: Button
Description: Show hotkey in caption (e.g. F1: Back)
Property: Label ID
Applies to: Label, Textbox, Button, Checkbox, Signature Capture
Description: Reference to the label show as text with the control
Property: Linked variable

Applies to: Label, Textbox, Button, Grid, Checkbox
Description: Name of the variable linked to the value of the control
Property: Linked variable form id

Description: Either empty (for a global type variable), or the id of the current form (for a local
type variable)
Property: Read-only
Description: Read-only controls show up grayed out
Property: Required
Applies to: Textbox
10 Development Guide
Description: When a button with the validate textbox property set is pressed, all textboxes with
the required property set must have data, otherwise an error is displayed.
Property: Selected index

Applies to: Grid
Description: Selected index
Property: Text
Applies to: Label, Textbox, Button, Literal HTML, Checkbox, Signature Capture
Description: Literal text to use instead of a label (you can use AX sys labels here)
Property: Validate textbox

Applies to: Button
Description: See Required
Property: Visible
Description: Visible property (invisible controls are not show)
Property: Text mode

Applies to: Textbox
Description: Set text mode to single line, multiline or password. See 11.8.2 for info on how to set
up the height of a multiline textbox.
3.3.2 Data grid column configuration
For data grids, an additional grid is shown allowing the developer to define the columns to be displayed in
the data grid, as well as create a mapping to variables. Please refer to chapter 8 for an example of how to
link data to a data grid.
Grid column Order of the column within the grid. Make sure the numbers are consecutive
(no numbers are skipped).
Label ID Reference to label shown in header of the column
Column width Width in pixels of the column. Use a width of 0 to hide the column
Query result list If a result list is used to populate the grid, this references the struct field used
for this column
Linked variable Name of the variable linked to the value of this column.
Linked variable Either empty for a global type variable, or the id of this form for a local type
form ID variable.
Creating a column definition for a data grid is not required. If the developer doesnt provide one, all of the
columns in the data linked to the data grid are displayed.
Development Guide 11
3.3.3 Device/Localized specific information configuration
The device/localized specific information grid is used to setup device or localized specific settings for a
control.
Device Type ID The specified device to set the specific configuration for
Language The specified language to set the specific configuration for
Font ID The font ID for this configuration
CSS Class ID The CSS Class ID for this control
Custom style attributes Custom style attributes for this control
Caption CSS Class ID The CSS Class ID for the caption of this control
Caption Custom style Custom style attributes for the caption of this control
attributes
Number of list lines For Grid controls only: the number of rows in the grid per page.
Signature Type Signature Capture only: sets the platform (HTML5, NaurTech or RhoElements).
Canvas Width/Height Signature Capture only: sets the size of the signature capture canvas.
3.3.4 Button actions

Button actions are used to configure navigation through the forms, creating a workflow.
Specifies the
button action
Button actions are performed by the framework when calling the onSubmit method of the form class. If you
want to prevent the execution of the button action in certain cases (for instance if a validation fails), you can
override the onSubmit method of the form, and there prevent the execution of the super method (either
return before super is called, or throw an error).
None/Custom
This button action is used when some custom action is performed (for instance calling some AX business
logic) without the need to navigate to another form.
Main menu
This button action causes the application to return to the main menu, regardless of whether there are other
forms on the form stack or not.
Logout
This button action causes the application to return to the main menu, regardless of whether there are other
forms on the form stack or not.
Show form (create always)

This causes the current form to be placed on the form stack, and a new form (specified in the button action
form id) to be designated as the new current form. If no instance exists of the form, it is created. A single
instance of a form can be added to the form stack multiple times, so take care when using this button action
Show form (create or return)

This button action does almost the same as Showform (create always), with one exception: if the new form
(specified in the button action form id) is already available in the form stack, all forms above it on the stack
are removed, and the new form is designated as the new current form. This is especially useful when the
application has to loop a sequence of forms many times (for instance, when performing item pick).
Return from form

This button action, which exists in several variants (OK, Cancel, Yes, No, etc.), pops the top most form from
the form stack and makes it the new current form, in effect exiting the current form and returning to the
previous one.
When the previous form is reactivated in this way, the onReactivate method on the form class is called. The
value shown in parenthesis corresponds to a parameter passed to this method, allowing the developer to
evaluate it and take some appropriate action.
Use this button action to create pop-up style forms, for instance when you need a pop-up where the
operator answers yes or no in response to some situation. See 5.4 for an example.
3.3.4.1 Button background images
See 11.8.1 for information on setting background images for buttons.
3.3.4.2 When to use Always Create and Create or Return with Showform
The use of the two forms of showform (create or return or always create) requires some additional
explaining. In most cases, it doesnt really matter which version you use. When you are creating a loop,
however, it is very important. See the following diagram.
Start process Capture X Capture Y Done? Yes End Process
Use create or
No return here!
If you are using the button action Show form (always create), or if you are using the in-code equivalent
.ShowForm(false);, the loop will put the Capture X and Capture Y screens on the form stack over and
over again, which will return in an overflow error if it continues to long. For the Show form that jumps back
to the first form in the loop, always use the ShowForm (Create or Return) button action, or the in-code
equivalent .ShowForm(true);.
Example of form stack when you loop while using the wrong always create option, note that the form stack
contains the same series of forms copied over many times.
FORM A
A
C
B
A
C
B
A
FORM
STACK
When using the correct create or return option, the form stack will only ever contain a single copy of the
form.
FORM A
A
FORM
STACK
3.3.5 Linked Variables

User controls may be linked to variables (either of the global or local variety, with the restriction that
they are on the same form for the latter).
Variable linked
to control
When displayed, the data of the variable is automatically used as the value for the user control. When the
value of the user control is modified by the user, the modified value is automatically stored in the variable.
The base type of the variable should be appropriate for the user control it is linked to (for instance, a date
type variable may be linked to a textbox, but not to a checkbox.
Control Type Allowed Base Type Linked property

Checkbox Enum (of type NoYesId) Checked
Data grid Integer, Int64 SelectedIndex
Textbox or label Date, Guid, Integer, Int64, Real, String, Time, Enum Text
Grid column Type should be compatible with the data displayed n.a.
Variables may also be linked to grid columns. When the user presses a button that has the data grid select
property set, the data in the column of the selected row of the data grid is copied to the linked variable.
3.3.6 Control specific actions
a control these buttons are shown.
Action Description
Move up The selected control is moved up 1 position
Move down The selected control is moved down 1 position
Copy control Copies or moves the control to another form
Remove control Removes the control from the form
Alternatively, these options are also available in the context menu of the control node in the tree view by
right mouse clicking the name of the control.
3.4 Form Designer (Beta)

The form designer is introduced in R4. The form designer is used to design and preview the form you are
working on. The form designer shows a design-time version of the form without the need of the use of the
portal. The form designer is a WYSIWYG-editor. WYSIWYG stands for What You See Is What You Get.
Hence, WYSIWIG principle on the form designer gives you a real-time version of the selected form.
You can add form controls using the top toolbar buttons or you can re-arrange the controls by dragging and
dropping them. Adding a form control will immediately create a control in the AX Anywhere application
configuration as well.
At this moment of writing you cant edit other properties of the control than the position of the control of it
itself even when you are able to do so (changing texts for instance) in the form designer. This should be done
in the Application configuration screen itself. The form designer is in a beta stage so it is limited in its use and
may not always work as expected.
3.5 The Application Configuration Framework tab
Definition of available Regular expression allows

devices along with different device types with
their resolution a similar resolution.
Meta tags added here are

added to the web page when
displaying on that device type.
Definition of available fonts,

largely made obsolete by
the addition of CSS.
The framework tab on the application configuration form is not context-driven so it is available at any time.
On this tab, device types can be defined, as well as the fonts used in the mobile application. These settings
are for all applications, not just the selected one.
Whenever anything is configured for several device types, (such as labels, or the fonts configured for
controls, or the number of lines for a data grid) the framework will consider the screen resolution of the
used mobile device, and choose the setting for the device type that matches that of the used device, or is the
next smallest, or failing that, the next largest. This ensures that the best possible configuration is selected for
the used device.
If a regular expression is specified, this is used to validate the browser type the browser reported when
loging on (see 14.1), and it not select the device type of the validation fails. This allows you to specify and use
multiple devices types with similar resolutions.
Note: The WMDEF device type is the default fall back device type (in other words, if the framework cant
find the device type youre logging in with, itll default back to that device type. It is part of the data
export that is supplied with the framework and must be imported as part of the installation process.
It must not be removed or modified, and the resolution of 240 wide by 320 high must not be
modified, or the framework will have trouble finding this default device type which may result in
failure to log on.
Note: If you are using a device that can operate in a 320 by 240 resolution (landscape), or has a resolution
that is otherwise less than 240 wide and/or 320 high, add a device type for this resolution, or you
may not be able to log on with this device.
3.6 The Application Configuration Style sheets tab
Definition of the style

sheets for this
application
Definition of the
mappings between the
CSS classes
The stylesheets tab on the application configuration form is application-driven so it is available at any time
an application is selected. On this tab, different stylesheets can be defined, as well as the CSS classes used in
the mobile application.
Please refer to chapter 11 for more information on the use of style sheets and CSS classes in the framework.
4. A case: Hello World part 1
This section details the creation of a small hello world application.Youll need to use the training VPC for
this. Log in using DYNANYDMO\administrator, with password pass@word1. Please note that the screenshots
are in AX 2012 but the functionality in AX 2009 works in an identical way.
4.1 Creating a new application

Start by executing the steps described below, in the order listed; refer to the image on the next page for
additional guidance.
1. Start with opening the designer and create a new application called HelloWorldP1 using the Add
application button on the bottom left side of the form or by right mouse clicking on the root node.
2. Then Select the new application, and create some labels1, as seen in the example below.
3. After this, create the entries for the main menu, also shownin the image on the next page.2
4. Finally, set the main menu property and title label of the application.
5. Optionally, you can set up a stylesheet value.

Go to the stylesheets tab, and create a line for stylesheet theme Default; set the css file to DAW.css.
Alternatively, create a Metro or iOS theme, and use the Metro.css or iOS.css stylesheet files.
1
Try to create the labels for all languages you wish to support from the start. However, always create at least
an entry for en-us for each label you create.
2
If you get an error message about the MainMenu CSS class id when adding a menu line, either clear the
value on the menu line, or add a reference to the CSS class table on the Style Sheets Tab for this CSS class.
5. Optionally, set up the style sheet.
The result should look something like this: Youll need to create a reference to a
(work through the items in order of the numbers) file in the style sheets tab. Look to the
other applications for an example.
4. Set the main

menu and title label.
3. Create the
menu items.
2. Create the
labels.
1. Create the application

Using the context menu
Please note that you can use both literal labels and sys labels. We do not recommend one over the other, as arguments
can be made for and against using the sys labels provided by AX.
4.2 Adding forms to your application
Next, well be adding two new forms to our application, called HelloWorld and LogOff. Select the new
application HelloWorldP1 to create forms.
4.2.1 Create the hello world form

First, create a new form by selecting the new application HelloWorldP1 and by clicking the New form
button at the left bottom side of the screen. Give in the name HelloWorld and select OK. A new form is
created and the application tree is updated. Select the form from the tree, and set the Title Label Id property
to the appropriate value.
You can use this number to
sort your forms in this grid.
Next, using the button called Create control at the bottom left side of the form, add a new user control called
LblHelloWorld, with the type set to Label. Uncheck the Add another control checkbox, and press OK. Select
the control in the tree, and set the properties as in the example below. Please note, once you save a record
you cant change name or type anymore.
Inserts a line break
after the control
Select the form again, and add a user control of type Literal HTML, called LitHorizontalLine, by going to the
form and selecting the Add control button at the bottom left side of the form. Set control type to Literal
HTML and press OK to create the new control. Then, set the properties as in the sample below.
Literal HTML tags need to be

XHTML (conform to XML).
Finally, add a user control of the type button named BtnOk (dont forget to set the control type before
pressing OK), and set the properties as in the sample below.
Causes the form to return to

the main menu when pressed.
We now have a form that displays a single fixed line of text, and has a button that returns to the main menu.
Please note that the default button the form is set to btnOK. This is set on the form properties of the current
form.
4.2.2 Configuring the logout form

Create a new form by selecting the new application HelloWorldP1 and by clicking the New form button at
the left bottom side of the screen. Give in the name Logoff and select OK. A new form is created and the
application tree is updated. Select the form from the tree, and set the Title Label Id property to the
appropriate value.
Then, select the form LogOut, and add a label control named LblAreYouSureto it, set the properties as shown
below.
Add a literal HTML control named LitHorizontalLine, and set the properties like this.
Add a button, named BtnNo.
And one button namedBtnYes.
The user logs out
when pressed.
Now, well change the default button for the Logoff form to BtnYes. This is set on the form properties of the
Logoff form.
Finally, we need to set up the main menu to open the forms we just added. Select the HelloWorldP1
application from the tree, and in the main menu section, select the forms you added in the jump to form
property of both the menu items.
4.3 Testing the application
Now were ready to test our little hello world. Go to the users tab under the DAW Framework menu option
in AX, and set the applicationHelloWorldP1 for one of the users.
If youre creating a new user, dont forget to go to the Employee/Roles form and select a role for the user,
and save the record, or the user may not be able to use the application correctly.
Now, start the browser (use the PDA option on the desktop of the training VPC) and log in using the user
name and password configured in the user form.
You can do this by printing the operator badge and scanning it into the login field (from the DAW Users form,
select one or more users, and then select print operator badge).
As you probably dont have a barcode scanner available, you can also manually enter the user name,
followed by the / character, and finally the password (for user 1000 in our example, use 1000/123).
If you find you have trouble logging in, check if youre using the correct user name and password. Also, when
using VPC with a non US keyboard, some characters show up under different keys so make sure youre not
accidently entering a character other than the / character as the separator character (open up notepad to
test this if you are not sure).
You now see the main menu (it may look slightly different depending on the type of browser youre using).
Select the hello world option from the main menu.
Select OK to go back to the main menu, and from there select the menuoption Log off.
Select Yes to log off.
5. Customizing the generated application and form classes
5.1 Introduction
For each application and form added during the design of the user interface, a class is automatically
generated in the AOT. These classes have two purposes. First of all, they are a means of customizing and fine
tuning the application designed in the designer, by overriding methods and adding code that responds to
user events. Secondly, they serve to create a presence in X++ of the varying user interface elements created
in the designer.
The classes for applications are generated with the name <application name>Main. The classes for forms are
generated with the name <application name><form name>. Both can be found in a generated shared project
named D2MFW_<application name>. Do not rename these classes or projects, as this might cause problems
executing the mobile application.
Looking at the sample shown above, you can see that for each form in the application, a getter function
(get<form name>) is added to the application class, and for each global type variable, a getter/setter
(var<variable name>) is added.
On the form classes, each user control gets a getter function (get<user control name>), and any local type
variable also gets a getter/setter (var<variable name>). Finally, each form also gets a getMain function,
which returns the application class for that form.
5.2 Responding to user submits (button and key presses)
The most common event to override is the submit event, which is fired whenever the user submits data
(presses a button, scans a barcode or enters a number). To override this event, find the class for the form on
which you want to add some custom code in response to a user event, and override the method onSubmit.
When adding custom code, make sure you first check if you are responding to the right submit, by checking
the submit target. In the sample below, the submitted data (an item id) is checked to see if an item with this
id exists, and its name is stored in a variable if it exists. Please note, submit is not always be the result of a
button press (it may also be caused by a refresh or a wake up), so make sure you always check the pressed
button before calling business logic.
public D2MFWEventHandleResult onFormSubmit(D2MFWControlInstanceID _submitTargetID)

{
D2MFWEventHandleResult ret;
InventTable inventTable;
;
// button OK pressed
if(this.getBtnOk().isSubmitTarget(_submitTargetId))
{
// nothing was entered
if(this.getMain().varItemId() == "")
return D2MFWEventHandleResult::OK;
// find the item in the database
inventTable = InventTable::find(this.getMain().varItemId());
if(!inventTable) // no data found
throw error ("unknown item!");
// store name of found item in variable
this.getMain().varItemName(inventTable.itemName);
}
ret = super(_submitTargetID);
return ret;
}
This example has a couple of interesting things to point out. First of all, the custom code is only executed
when the OK button was submitted. This is very important, if you do not check the submit target the custom
code will be executed on each submit, even simple screen refreshes. You can check if a submit event is
caused by a certain user control (nearly always a button) by feeding the _submitTargetId parameter to the
isSubmitTarget method of the control.
Another interesting point to make is the use of throw error. The text provided with this throw will be shown
to the user. In addition, the throw prevents the call to the super method, which might have caused the
application to navigate to another form. Finally, the throw rolls back any updates in the current transaction,
which means that when the user sees the form with the error message, the application session is in the same
state is was in before the user submitted the faulty data.
If you want to prevent the button press to navigate to another window, but you dont want to roll back the
current transaction, you could also return the value D2MFWEventHandleResult::OK, without calling
super(),so any navigating configured as a button action is bypassed.
Make sure you perform the call to super()after you have finished processing the user submit, if you call it
earlier it may navigate to another screen, and variables may have been set or cleared, and business logic may
have been called, during navigation.
5.3 Initializing objects when the form loads
Another common use for custom code is to initialize some data of modify the properties of a control (for
instance to hide a button for an option that is disabled in the configuration). To override this event, find the
class for the form on which you want to add some custom code when it loads, and override the method
onLoad.
The onLoad event is called whenever the form is navigated to from the main menu, by a button which has a
Show form button action configured, or from code by a call to the <formClass>.showForm method.
public D2MFWEventHandleResult onLoad()

{
ret = super();
// initialize a user control and variable

this.btnPrint().visible(NoYes::No);
this.getMain().varSelectedItemId("");
return ret;
}
Handle the call to super first, as this will clear all controls that have the clear on load property set.
5.4 Responding to user input from a previous form

Sometimes it is very useful to be able to ask the operator a question, and wait for a response (for example,
an are you sure pop-up where the user can respond with yes or no).
If a form is closed by a return from form button action (or a call to this.returnFromForm in code), the form
that is pulled from stack and is now the new active form will have its onReactivate method called. To
respond to the user selection in a previous form, find the class for the form, and override the method
onReactivate.
public D2MFWEventHandleResult onReactivate(D2MFWFormInstanceID _returnedFromFormID,

D2MFWFormResult _formResult)
{
ret = super(_returnedFromFormID, _formResult);
if (this.getMain().getAreYouSure().isReturnedFromForm(_returnedFromFormID))
{
if (_formResult == D2MFWFormResult::Yes)
{
// do something here
}
else // do nothing (just show the current form again)
return D2MFWEventHandleResult::OK;
}
return ret;
}
In this example, code is added for when the form is reactivated after a form called AreYouSure exits
(presumably, this form navigated to the AreYouSure form). You can see how to respond differently
depending on the result the AreYouSure form exited with. You can find an example of this in chapter 10.
Handle the call to super first, as this will clear all controls that have the clear on reactivate property set.
5.5 An overview of other form event methods
These methods can also be overriden, although they are far less commonly used than the previous ones.
5.5.1 OnControlCheckedChanged
This method is called when a control on the form has its checked property changed by the operator. Please
note, this event will execute after the user submitted the changes by pressing a button or function key, so
this is not real-time!
5.5.2 OnControlSelectedIndexChanged
This method is called when a control on the form has its selected index property changed by the operator.
Please note, this event will execute after the user submitted the changes by pressing a button or function
key, so this is not real-time!
5.5.3 OnControlTextChanged
This method is called when a control on the form has its text property changed by the operator. Please note,
this event will execute after the user submitted the changes by pressing a button or function key, so this is
not real-time!
5.5.4 OnDeactivate
This method is called when a form navigates away to another form by a showform button action or by calling
<formClass>.ShowForm.
5.5.5 OnInit
This method is called when a form is instantiated, and is usually only called once during the lifetime of an
application session.
5.6 An overview of application event methods
The application class also has some methods that can be overridden, although they are seldom used.
5.6.1 Onload
This method is called when the application is loaded. It is not called when the user logs in again on an
already instantiated application.
5.6.2 OnLogoff
This method is called when the user logs off from the application. It is not called if the web session expires,
only when the framework performs a log off.
5.6.3 OnMenuSelect
This method is called when a menu option is selected. When overriding this method, pass over the call to
super if you dont want to perform the action associated with the menu item (opening a form, submenu or
other application).
5.7 Responding to events in general, calling event methods explicitly from code
When responding to events in general, make sure you return a D2MFWEventHandleResult value if required
(some event methods are void methods and dont require the return of a result value). Use either the return
value of super or return D2MFWEventHandleResult::OK if you didnt call super.
This is important because the framework will take a cue from the returned value for further navigation, and
returning a value other than D2MFWEventHandleResult::OK may result in unexpected behavior.
You can also explicitly call an event method when reacting to another event method. In the example below,
we have a form where the user inputs an item id. Upon returning from a list form where the user selected an
item from a list, we accept this item and call the performOnFormSubmit method to simulate the user
pressing the OK button.
public D2MFWEventHandleResult onReactivate(D2MFWFormInstanceID _returnedFromFormID,

D2MFWFormResult _formResult)
{
D2MFWEventHandleResult rv = super(_returnedFromFormID, _formResult);
if((_formResult == D2MFWFormResult::OK) &&

(this.getMain().getListItems().isReturnedFromForm(_returnedFromFormId)))
{
// set ItemId in textbox and simulate press OK
this.getTxtScannedData().text(this.getMain().varItemId());
return this.performOnFormSubmit(this.getBtnOk());
}
return rv;
}
Please note that the return value from performOnFormSubmit is returned instead of the return value from
the call to super. This is especially important when explicitly calling onFormSubmit, failing to do so for this
method may result in buttons with the main menu or logout button action not working anymore.
6. A case: getting some item information
Inevitably, there comes a point when business logic needs to be called to look up some information, register
some data, validate some user input etc. This is done by adding business logic to the classes the framework
generated when forms were added to the application.
For this case, well add a form to our Hello World application where the user scans or enters a unit id, and
well look up the item in the AX table InventTable. This involves modifying the form class to add some
validation and querying.
6.1 Adding the forms in the application configuration

First, we add some labels.
Next well create two forms called ScanItemId and ShowItemName (dont forget to set the Title label ids of
both forms to Item Information).
On the application variables grid of the HelloWorldP1 application tab, we also create two global type
variables called ItemId and ItemName (with matching extended data type, although it is not a requirement
that they have the same name).
Select the form ScanItemId and add a textbox control called TxtItemId.
Checks if something
is filled in (see also
OK button)
Clears the control

when the form is
opened. Set up a linked variable Gets a caption from the
to this control here. EDT (e.g. Item Id:___)
Add a horizontal line using a new Literal HTML control called LitHorizontalLine and set the text property to
<hr />.
Then add a button called BtnBack and set the properties shown in the screenshot below.
And add a button called BtnOk followed by setting the properties shown in the screenshot below.
Checks all required Show form button action

textboxes when this navigates to another
button is pressed. form when pressed.
Finally, set the default button property of the form ScanItemId to BtnOk.
6.2 Create a form that displays the result
Next, select form ShowItemName and add a label called LblItemId.

Linked variable set to
captured item id.
And add a label called LblItemName.

Linked variable set to
queried item name.
Add a horizontal line called LitHorizontalLine and set the text property to <HR />.
Using show form (create or

return) instead of return
from form, so the load of
And finally, add a button called BtnOk. ScanItemId is triggered, and
the textbox is cleared.
Finally, go back to the Application HelloWorldP1 and add a main menu line for the form ScanItemId.
6.3 Adding some custom code to your application
Now we need to add code to the class that goes with the ScanItemId form. Open the projects tab in AX, and
find the public project named D2MFW_HelloWorldP1.
Select the classes HelloWorldP1ScanItemId, right click and select Override method, and then select
OnFormSubmit.
Add the following code in the overridden method.

{
;
// Button OK Pressed?
if(this.getBtnOk().isSubmitTarget(_submitTargetId))
{
// find the item in the database
inventTable = InventTable::find(this.getMain().varItemId());
if(!inventTable) // no data found
throw error ("unknown item!");
// store name of found item in variable

this.getMain().varItemName(inventTable.itemName());
}
ret = super(_submitTargetID);
return ret;
}
Save and compile your code. Note: if youre using AX 2009, the inventTable.itemName() does not work. By
removing the () characters, the code compile will be successful.
6.4 Testing your modifications
First, log out of the application if you havent already (if you dont, your changes might not show up). If your
web session has expired, youll need to log in first to be able to log out! If youre still having trouble, you
can try to delete your session from the Active Sessions form (see chapter 14).
Now, log back in.
Your new menu item

shows up on the bottom.
Change the line number to
move it up or down.
Scan or enter an
item id here (try
1001).
The name of the item

should show up (or an error
message if the item id you
entered wasnt valid).
7. The transaction log
7.1 Introduction
Now is a good time to look at the transaction log. From the AX main menu, select DAW Framework, and
select Transaction Log.
Events received
from the Portal
(newest on top).
Event sent by the

Portal (logon, key
press, etc.).
Response from
the framework.
Contents of the AX info log

after handling the event.
Here, youll find all transactions send to the framework by the DAWFW Mobile Portal, and the response from
the framework. Also displayed here are the contents of the infolog at the end of event handling.
Often, when your application is behaving erratic, youll find an answer here. For instance:
You may find error

messages in the response.
7.2 Cleaning up the transaction log

Theres aCleanup transaction log button on the transaction log form to clean up the transaction log. You can
specify the age of transactions to clean from the log. This action can also be batched.
7.3 Debugging the application
The transaction log offers an option to feed a logged transaction back to the framework for testing purposes,
breaking to the debugger as processing starts. In order to make this work, youll need to have AX configured
so it will allow debugging, refer to the AX documentation for more information on how to do this.
7.3.1 Notes on application state

An important fact to keep in mind when trying to debug a transaction is that the application should be in the
same state as it was when the transaction was received or it will not work as intended. Consider the case
where a transaction contains a submit of a button on form A, but the application has already moved on to
form B. Execution will now fail as form B will not contain the button that caused the submit action.
As a rule of thumb, you can debug a transaction if your application is at the same form instance it was when
the transaction was originally received (so no logging out in-between).
7.3.2 Breaking your code with a throw so you can debug

If the transactions you want to debug result in navigating away from the current form, or if it is performing
some registration that invalidates a second pass through, there is a trick you can perform. Consider the
example with the item information screens we created earlier. Suppose we want to debug the query in
InventTable we created in chapter 6.
To do this, first modify the code to include a throw error, and save and compile it:
Throw an error
here.
Next, perform the action in the application, so it'll execute the bit of code with the throw error in it.
The thrown error

shows up here.
Go back to your code, remove the throw, set a breakpoint, save and compile
Remove the throw,

set a breakpoint.
Next, well look up the transaction in the transaction log.
7.3.3 Debugging your code
Go to the Transaction Log, and select the last transaction (if youre in an environment with multiple active
sessions, you can look in the response field for your throw error text).
This button
starts debugging
the transaction.
The text from the

error throw
shows up here.
Next, press the button Debug Transaction. If AX is set up correctly for debugging code, the debugger will pop
up.
The run button

will take you to
your breakpoint.
Press the Run button to jump to your breakpoint.
Were now in our
own code, and
can debug it.
You can now debug your code.
8. A case: showing information in a data grid
Populating a data grid can be done manually, but the easiest way is to use the fillFromList method available
on the data grid class, which accepts a packed list object for a list of struct classes, where each struct class
contains a row of data. In the grid configuration, you can map the name of the field in the struct class to a
column in the data grid.
Note: in previous versions, we did use a method called FillFromQuery to populate data grids. This method
will still work, but it is much less efficient, and is now deprecated. Try to use FillFromList instead. With
FillFromQuery, you had to pass a list iterator for a list, with fillFromList you pass the list as a packed list (use
<list>.pack() to create one), so changing to FillFromList requires only a minor modification any existing code
you may have.
8.1 Adding a new form to the designer

For this case, well add an additional form to the item information forms, which will show a list of items.
First, we need to add some labels.
Add a new form called ListItems and set the title label to Items.
On this form, well display a grid with all the items, where the user can select an item.
Select the ListItems form and add a data grid control named GridItems (leave it as it is for now) and a
horizontal line (refer to the previous hands-on sections if youre unsure how to do this).
Then, add a button control called BtnBack.
Next, add a button control called BtnOK.
Check this box so the OK

button selects data from
the grid.
Finally, select the form ListItems, and set the default button to BtnOK.
8.2 Adding code to look up the item
Now, find the newly created class HelloWorldP1ListItems in the project D2MFW_HelloWorld (you may need
to close and then reopen the project to refresh the contents), and add a new method named qryItems. To do
this, right click the class and select new method.
private container qryItems ()

{
str structBuild = "str ItemId; str ItemName; str ItemGroupId";
struct s;
List resultList = new List(Types::Class);
;
while select * from inventTable

{
s = new struct (structBuild);
s.value("ItemId", inventTable.ItemId);
s.value("ItemName", inventTable.itemName());
s.value("ItemGroupId", inventTable.ItemGroupId());
resultList.addEnd(s);
}
return resultList.pack();
}
This method is used to populate the grid with data. It fills a list with structs, where each struct represents a
line of data to be displayed in the grid. Finally, the list is packed and returned.
Next, well add a call to the method we just created, so override the onLoad method of the class
HelloWorldP1ListItems, and add a call to the fillFromList method of the grid, passing the packed list object
created by the qryItems method, to populate the grid.
public D2MFWEventHandleResult onLoad()

{
ret = super();
this.getGridItems().fillFromList(this.qryItems());
return ret;
}
Here, the packed list from our first method is passed to the .fillFromList method that is unique to data grids.
Upon entering the form, the data grid will now be populated by data from the invent table. Next, well set up
the data to display.
8.3 Setting up the data grid
Then, go back to the designer, select the form ListItems and then select the GridItems control.
On the Grid configuration (which only appears when you select a grid control), create the column mappings
as shown here.
Set to 0 to hide This links data from the When a button with Data Grid Select
this column. method to the column. is pressed, this variable is filled.
Please make sure the texts in the Query result list mapping column matches the names of the fields in the
structs we created in the qryItems method.
8.4 Navigate to the new form

Select the form ScanItemId from the application configuration form.
Add a button called BtnList to navigate to the new form.
Use the move up/move down Navigate to form

controls to move the control to ListItems.
the right position.
Also, remove the append newline on the TxtItemId textbox so the button sits directly to the right of it.
Clear this so the

button ends up right
next to the textbox.
8.5 Test the modification
Now, test the result (dont forget to log out first or delete your session or the changes may not show up
correctly). It should be something like this:
Select this
button
Select an item
and press OK
Select the item info option. Press F3: Items to display the list
The item shows

up here
After pressing OK, the item is selected.
If you are up for an extra challenge, you may want to try to display the ItemGroupId field in the data grid,
and if youre feeling up to it, maybe add the current stock level of the item to the grid, too.
9. Manipulating the framework through code
Much of the configurable effect of the framework can also be performed by calling code in X++. This section
provides an overview of the various objects that can be called from code.
9.1 Methods of the application class

9.1.1 About the application class
The application class is called <application name>Main, and can be found in the automatically generated
project with the name D2MFW_<application name>. To get the application class when executing a method
in a form class, just call this.getMain(), which will return a reference to the main class.
9.1.2 Getters for form classes

The application class contains a getter method for every form in the application. The getter method is named
get<form name>. This makes it very easy to access the properties and methods of any form from code.
9.1.3 Getters/setters for variables

The application class contains a getter/setter method for every global type variable. The name of this
method is var<variable name>. This makes it very easy to access variables from code.
9.1.4 FindLabel
Use this method to quickly find a (DAW) label (without having to provide the device type id and language id).
9.1.5 GetDeviceTypeId
This method returns the device type id for this session.
9.1.6 GetHostname and GetUserId

These getter methods return the logged in user id and hostname (IP address) of the current session.
9.1.7 GetLanguageId
This method returns the language id of the current language for this session.
9.1.8 Get/SetMainParam and Get/SetMainParamContainer

These methods allow you to get or set a global type variable without creating it in the designer, using a text
string instead to reference it. Using these methods is not recommended as it might seriously compromise
the proper functioning of variables created during design.
9.1.9 Logoff
This method logs off the current application. When calling from an event method, return the return value of
this method to properly log off.
9.1.10 ReturnFromForm
Deactivates the current active form, and set the top form on the form stack as the new current form. This is
the same as the return from form button actions. It takes a parameter that is passed to a call to the previous
forms onReactivate event method as _returnResult.
9.1.11 ShowFormByInstanceId and ShowFormByConfigId

This method shows a form, taking either the form instance id or the form configuration id as a reference. It is
preferable to show a form in code by using the form getter method to get the form class and call its
ShowForm method, which doesnt require parameters. This is the same as setting the showform button
action.
Leaving the _returnToExisting parameter false, the current active form is placed on the form stack, and the
new form is instantiated if needed, and set to the new current form.
If the _returnToExisting parameter is set to true, and the new form is already somewhere in the form stack,
the forms above it on the stack are removed and the form is set active. If the form is not already in the stack,
the system behaves just as if the parameter was left false.
9.1.12 ShowMainMenu
This method returns the application to the main menu. When calling from an event method, return the
return value of this method to properly return to the main menu.
9.2 Methods of the form class
9.2.1 About the form class
The application class is called <application name><form name>, and can be found in the automatically
generated project with the name D2MFW_<application name>.
9.2.2 Getters for user control classes

The application class contains a getter method for every user control on the form. The getter method is
named get<control name>. This makes it very easy to access the properties and methods of user control
from code. Available methods will vary with the type of control returned (e.g., a class for a text box will not
have the checked property).
9.2.3 Getters/setters for variables

The application class contains a getter/setter method for every local type variable. The name of this method
is var<variable name>. This makes it very easy to access variables from code.
9.2.4 Get/SetFormParam and Get/SetFormParamContainer

These methods allow you to get or set a local type variable without creating it in the designer, using a text
with proper functioning of variables created during design.
9.2.5 GetHostname and GetUserId

These getter methods return the logged in user id and hostname (IP address) of the current session.
9.2.6 Get/SetMainParam and Get/SetMainParamContainer

These methods allow you to get or set a global type variable without creating it in the designer, using a text
with proper functioning of variables created during design.
9.2.7 IsReturnedFromForm
This method takes the _returnedFromFormId parameter passed to the onReactivate event method, and
returns true if it matches the forms instance id.
9.2.8 PerformButtonNavigation
This method performs the navigation action associated with a button on the form. Use this when you want
to perform the navigation action associated with another button, but not the business logic in onSubmit.
Important: when calling this from another event method, make sure you return the value returned by this
function when you exit the event method. If you call the onSubmit of the form like this, dont call super as this
might interfere with the navigation performed by the PerformButtonNavigation method.
9.2.9 PerformOnFormSubmit
This method calls the onFormSubmit method, but takes the control class for the button as its parameter
instead of the control ID of the button, so it is easier to call.
Important: when calling this from another event method, make sure you return the value returned by this
function when you exit the event method. If you call the onSubmit of the form like this, dont call super as this
might interfere with the navigation performed by the PerformButtonNavigation method.
9.2.10 ReturnFromForm
Deactivates the current active form, and set the top form on the form stack as the new current form. This is
the same as the return from form button actions. It takes a parameter that is passed to a call to the previous
forms onReactivate event method as _returnResult.
Please note this method closes the current active form, which might not be the form that the calling class is
linked to.
9.2.11 ShowForm
This method shows the form, making it the new current form. This is the same as setting the showform
button action. Leaving the _returnToExisting parameter false, the current active form is placed on the form
stack, and the new form is instantiated if needed, and set to the new current form.
If the _returnToExisting parameter is set to true, and the new form is already somewhere in the form stack,
the forms above it on the stack are removed and the form is set active. If the form is not already in the stack,
the system behaves just as if the parameter was left false. Refer to 3.3.4.2 for an explanation off the correct
use for both of these options.
9.3 Methods of user control classes

9.3.1 About the user control classes
The user control classes are returned by the getter functions that are automatically generated in the form
class when a user control is added to the form. Depending on the type of user control, some of the methods
described below may not be available. The user control classes are D2MFWTextControlClass,
D2MFWCheckboxControlClass, D2MFWListControlClass, D2MFWComboboxControlClass and
D2MFWDatagridControlClass.
9.3.2 BoundDataCount (data grids only)

This method returns the number of rows of data for a data grid.
9.3.3 BoundDataContainsField (data grids only)

This method returns true if the struct containing the data for a row in the data grid contains the specified
field.
9.3.4 CaptionCssClassId
This getter/setter allows the developer to evaluate or set the CSS class ID applied to the caption that is
created when the get caption from extended data type property is set.
9.3.5 CaptionCustomStyleAttribute
This getter/setter allows the developer to evaluate or set the HTML attributes applied to the caption that is
created when the get caption from extended data type property is set.
9.3.6 Checked (checkbox only)

This getter/setter allows the developer to evaluate or set the checked value of a checkbox control, setting
this property also sets the linked variable if any.
9.3.7 ClearBoundData (data grids only)

Clears the list of data associated with a data grid.
9.3.8 CssClassId
This getter/setter allows the developer to evaluate or set the CSS class ID applied to the control.
9.3.9 CustomStyleAttribute
This getter/setter allows the developer to evaluate or set the HTML attributes applied to the control.
9.3.10 FillFromList (data grids only)

This method populates a data grid. It accepts a packed list (container) for a list of struct classes, where each
struct class represents one row of data. The name of the struct fields should correspond with the query
result mapping property of the data grid in the designer (see also 0). This method replaces FillFromQuery.
9.3.11 FillFromQuery (deprecated)

This method is deprecated. Use FillFromList instead.
9.3.12 GetBoundData, GetBoundDataStruct (data grids only)

Use these methods to get data from a data grid. Use GetBoundData to get a specific column in a row, or
GetBoundDataStruct to get the entire row. Row index is optional (leave empty for the current row).
9.3.13 HasFocus and SetFocus

Use this method to check if a control has the focus or set the focus to the control. Please note, this just
notifies the DAWFW Mobile Portal to set a specific control to be focused, and does not prevent the user
from selecting another, nor does it reflect the focus the user set (so this method cant be used to check if the
cursor is currently in a specific textbox for instance).
9.3.14 IsSubmitTarget (buttons only)
This method takes the _submitTargetId passed to the onSubmit event method on a form class, and returns
true if the target of the user submit is this control. This method is available on all controls, although its most
often used for buttons.
9.3.15 ListFields (data grids only)

This method returns a list of the field names in the structure containing the data for a data grid row.
9.3.16 ReportFilePath (report output only)

This method allows setting or getting the report file path.
9.3.17 SelectedIndex (data grids only)

This getter/setter allows the developer to manipulate the current selected row on list type controls, setting
this property also sets the linked variable if any.
9.3.18 Text
This getter/setter allows the developer to evaluate or set the text value of a control. For text controls,
setting this property also sets the linked variable if any.
9.4 Using the signature capture control
Newly added in version 5, the Signature Capture control allows the user to sign on screen, and captures the
image of the signature to be stored in AX. Since the control relies strongly on client side capabilities, it is only
available for clients that can run HTML5, clients running the Naurtech browser or client that run the Rho
Elements browser.
The signature capture control is slightly different from other controls in that the get method on the form
class does not return a wrapper class but the instance record for the control. The example below shows how
you can pull the image information from the control and add it to in this case a docuref on the last salesorder
that was created.

{
DocuValue docuValue;
DocuRef docuRef;
List list;
ListEnumerator listEnumerator;
SalesTable salesTable;
container baseContainer;
BinData binData;
D2MFWSignatureCapture signatureCapture;
str base64data;
;
if(this.getBtnOK().isSubmitTarget(_submitTargetID))
{
list = list::create(this.getsigCapture().getDocumentContents());
if(list.elements() > 0)
{
listEnumerator = list.getEnumerator();
while(listEnumerator.moveNext())
{
if (listEnumerator.current()=='[]')
throw error ("Please provide signature");
signatureCapture = new D2MFWSignatureCapture();

signatureCapture.parmSignatureType(this.getsigCapture().getSignatureType());
signatureCapture.parmCanvas(this.getsigCapture().signatureCanvasWidth,
this.getsigCapture().signatureCanvasHeight,
5);
signatureCapture.parseData(listEnumerator.current());
signatureCapture.createImage();
base64data = signatureCapture.getBase64Bitmap();
baseContainer = BinData::loadFromBase64(base64data);
binData = new BinData();
binData.setData(baseContainer);
select firstOnly salesTable order by salesTable.salesId desc;

docuValue.File = binData.getData();
docuValue.FileName = strFmt('signature-%1.png', salesTable.SalesId);
docuValue.insert();
if (!docuType::find('Image'))
throw error(strFmt("Unknown document type"));
docuRef.ValueRecId = docuValue.RecId;
docuRef.RefTableId = tableNum(salesTable);
docuRef.RefRecId = salesTable.RecId;
docuRef.RefCompanyId = curext();
docuRef.TypeId = 'Image';
docuRef.Name = 'Customer signature - demo';
docuRef.insert();
}
}
}
return super(_submitTargetID);
}
9.5 Using the Report Output control
Newly added in version 5, the Report Output control presents the user with a button that downloads file that
can be opened on the client. You can use this to allow the user to download a PDF version of a generated
report to review and possibly print from their client.
The Report Output control doesnt provide any properties to on the designer, and only one property to be
used from the user control class.
The developer should provide the report in for instance PDF format on a location that is both accessible from
the portal application and from the AOS.
In the onLoad method of the form you have put the report output control on, provide the path to the report
(from the point of view of the web application), by using the reportFilePath method that is available from the
user control class (e.g. this.getMyReportControl().reportFilePath()).
10. A Case: reacting to return from form result values
If is often very useful to have pop-up style dialog windows, where the operator has to respond to a question
by choosing one of several options (e.g. Are you sure? (Yes/No), Continue? (OK/Cancel)).
To create pop-up style dialog boxes, create a dialog form with two or more buttons and set the button
actions of these forms to different versions of the return from form actions. You can show this form from
another form, and react to the choice of the operator by evaluating the _formResult parameter that is
passed to the onReactivate method of the calling form when the dialog form exits.
10.1 Automatically continue after selecting an item from the list

For this case, we will use the list we created in chapter 8, and add functionality to it so that after we select an
item, we dont go back to the ScanItemId form where we have to press OK, but instead continue straight into
the DisplayItemName form.
Of course, we could do this by letting the OK button on the ListItems form navigate straight to the
DisplayItemName form, but wed be skipping the business logic we added to the onSubmit method in
chapter 6, so the item name would not be filled in.
Instead, well leave it as it is, and in the form ScanItemId, well add code to the OnReactivate method, where
well first determine if the user pressed OK on the ListItems form, and if the user did, well execute the
business logic that goes with the OK press on the ScanItemId form.
10.2 Adding code to the OnReactivate method

To have the ScanItemId form automatically continue after the ListItems form closes, open the shared project
D2MFW_HelloWorldP1, locate the class HelloWorldP1ScanItemId, and override the OnReactivate method (if
you dont remember how to do this, please refer to chapter 6).
Change it so it looks like this:
public D2MFWEventHandleResult onReactivate(D2MFWFormInstanceID _returnedFromFormID, D2MFWFormResult

_formResult)
{
ret = super(_returnedFromFormID, _formResult);
// when the form ListItems was closed

if(this.getMain().getListItems().isReturnedFromForm(_returnedFromFormID))
// and the user pressed OK
if(_formResult == D2MFWFormResult::OK)
// call the logic that goes with pressing the OK button on this form (ScanItemId)
return this.onFormSubmit(this.getBtnOk().getControlInstanceID());
return ret;
}
Save and compile the code.
Now, after the user selects an item from the list of items and presses the OK button, the business logic that
goes with submitting a press of the OK button on the ScanItemId form is executed. Remember, we set the
button action property of the OK button to return from form (OK), and that is what we are checking in this
bit of code by comparing it with D2MFWFormResult::OK.
You can now check your changes. Note that after you select an item from the list and press the OK button,
the application goes straight to the form displaying the item name. Also note, if you exit the list form by
pressing cancel, you simply return to the item id input form.
This same method could also be used to react to a user response to a form that offers a yes/no, or ok/cancel
kind of dialog window.
11. Configuring CSS and style sheet files
11.1 Style sheet files that come pre-installed
Starting with Release 4 of the Dynamics Anywhere framework, several style sheets come pre-installed with
the portal application. They are the default (legacy) style, Metro (or Modern UI) style and iOS style. The
latter two give a mobile application the look (but not necessarily the feel) of these two platforms.
Default (legacy)
Metro (or Modern UI)
iOS
11.2 Working with style sheets in the Dynamics Anywhere Framework
11.2.1 File location
The cascading style sheet files are located under the installation directory of the portal, in the sub directory
Code\CSS. Place your own customized style sheet files there too if you have them.
If you are planning to create your own style sheet, it may be a good idea to base it off one of the existing
style sheet files weve supplied, so you can be sure youve created entries for all the CSS classes that may be
required by our solution.
11.2.2 How to create a reference to a file (theme)

In the Application Configuration form, go to the style sheet tab.
There, under Stylesheets, create a new line. Specify the name you want to use to reference your style sheet
under Stylesheet theme, specify the name of the actual style sheet under Stylesheet file.
You can select a StylesheetResource from the drop down list; this will apply the style sheet to the Form
Designer (see 3.4). The resource D2MFWDefaultTheme can be selected if you have not added any of your
own.
11.2.3 Device type specific themes
Note that you can make multiple entries for the same Stylesheet Theme id, each for a different device type.
In this way, you can have one theme map to different actual style sheet files for different device types, for
instance to use a larger type face for devices with a higher resolution and a smaller one for devices with a
low resolution.
Make sure that you always supply an entry for the WMDEF device id as that is what the framework will fall
back to if a style sheet for a particular device type isnt provided.
11.3 Adding the CSS Classes
11.3.1 Adding and modifying
To actually start using a CSS class with components on your forms, you need to create a CSS class ID mapping
to an actual CSS class in the style sheet file. You can do so under the style sheet tab, under CSS classes.
To add a CSS class reference, create a new line. Specify the CSS class ID you want to use to reference the CSS
class. For the CSS Class property, provide the name(s) of the CSS classes as specified in the style sheet file.
11.3.2 Default classes

Some default CSS class names are used by the framework, and will be automatically generated when you
add that type of component to your application for the first time. They are:
CSS Class Description

Button CSS class for a button
CheckBox CSS class for a checkbox
GridView CSS class for a data grid (see 11.3.4)
Label CSS class for a label component
TextBox CSS class for a textbox
Caption CSS class for text generated using get caption from EDT (see 3.3.1)
MenuButton CSS class for a menu button
FormTitle CSS class for the title of the form
11.3.3 Combining classes

It is possible to create a CSS Class ID that references a combination of actual style sheet classes, by
separating the CSS classes name with a space character.
11.3.4 Special note for data grids
The CSS class you specify with the a data grid is also used to specify which CSS class is to be used for specific
parts of the datagrid, such as the highlighted row or the button bar.
Part of data grid CSS Class name constructed from the provided CSS Class ([CSSClassName])
Grid component [CSSClassName]
DIV surrounding grid [CSSClassName]EnclosingDiv
Grid header [CSSClassName]HeaderStyle
Grid row [CSSClassName]RowStyle
Alternating row [CSSClassName]AlternatingRowStyle
Selected row [CSSClassName]SelectedRowStyle
Pager (button bar) [CSSClassName]PagerStyle
11.4 Setting the theme

11.4.1 On application level
To specify the style sheet theme to be used for the entire app, select the application in the Application
Configuration form, and select the theme from the list.
11.4.2 On form level
To override the theme selected for the application for a single form, select the form and specify the theme
from the list. Note: you do not have to provide a theme for all forms, if none is selected the framework will
use the theme specified for the application (see 11.4.1).
11.4.3 The log in screen

Since the portal application isnt able to access the style sheet setup in AX prior to the user logging in, the
login screen cannot be displayed in a style that is configured in AX. It is instead configured in the
appsettings.config file (refer to the installation and configuration guide for more info on this subject).
<add key="DefaultCSS" value ="~/code/css/Metro.css"/>
This setting is also the setting the application is displayed in when no style sheet is specified on the
application.
11.5 Specify the class on a control
11.5.1 Menu items
To specify the CSS class of a menu button, select it from the list. You can use this to create buttons with icons
on them as shown in the Metro style sheet.
11.5.2 Form caption

To select the CSS class of the form title, select the form and select the CSS class there.
11.5.3 Controls
To specify the CSS class to be used by a control, select the control in the Application Configuration, and set
up the style sheet in the Device/localized specific settings.
By default, all the controls you create will be assigned with the default class on creation (see 11.3.2). You can
override the CSS Class id value to set a different CSS class.
The EDT caption CSS class id setting is used to specify the CSS class used by the caption text that is
generated when the Get caption from extended data type option is enabled.
You can create entries for multiple device types, so you can specify that a control uses one type of CSS class
on one type of device, and another type for another type of device. Make sure you always supply an entry
for the WMDEF device type as that is what the framework falls back to if no entry is provided for a specific
device type.
11.5.4 Specify a HTML attribute

In addition to the CSS classes you can specify for a control, you can also add HTML attributes to a control. For
the control itself, just specify the HTML attributes on the Custom style attribute(s) column. For attributes
you want to apply to the caption created by using the Get caption from extended data type setting, specify
them in the EDT caption custom style attribute(s).
11.6 Changing CSS and HTML attributes during runtime
Runtime, you can modify the CSS class and custom HTML attributes of a control, by calling the .cssClassId,
.customStyleAttribute, .captionCssClassId and .captionCustomStyleAttribute getter/setter methods, that are
available from the control class (see 9.3).
11.7 More information on CSS file format and HTML attributes

For more information on how CSS files and HTML attributes, please refer to the many sources that can be
found online or in your favorite book store.
11.8 Some useful CSS settings
Below are some common effects that can be achieved using modifications to the CSS classes.
11.8.1 Adding a background image to a (menu) button
Adding a background image to a (menu) button involves combining the regular (menu) button class with a
CSS class that specifies the background.
First of all, add a CSS class to your CSS file to specify the background image, like so. Make sure you also
provide the background image and it is accessible through the web application.
.MenuButtonPU
{ background:url('../../Files/Media/Metro/purchase-requisition.jpg') no-repeat center #41B1E1;
}
.MenuButton{
padding: 0px;
margin: 2px;
width: 95px;
Next, specify the CSS class id in the designer; in the CSS class property to put both the button CSS class and
the CSS class specifying the background image, separated by a space.
Finally, assign the CSS class to your (menu) button.
This lets you set a static background image. If you wish to have a dynamics background image instead, use
the HTML attribute on the button to set a background image at runtime (see 9.3.9).
11.8.2 Setting the height of a multiline textbox
If you set the multiline property of a textbox, by default it will set enable the scroll bar, but the height of the
textbox itself remains unchaged. To change this, in the CSS file, create a copy of the textbox CSS and change
the height property to a higher value. In this example, setting it to 100 will increase the height five times.
.TextBoxMultiLine{
border: 1px solid #DDDDDD;
background-color: #DDDDDD;
font-size: 1em;
vertical-align: middle;
line-height: 20px;
height: 100px;
width: 140px;
margin: 1px;
}
.TextBox{
border: 1px solid #DDDDDD;
background-color: #DDDDDD;
font-size: 1em;
vertical-align: middle;
line-height: 20px;
height: 20px;
Then, just add this new CSS class to the CSS class table and assign it to your textbox.
12. A Case: Adding Signature Capture
The following exercise adds a signature capture form to the application.
Start by adding some labels:
Next, add a form, call this form SignatureCapture. Dont forget to select a title label.
Add a signature capture control, call this SigSignHere.
Set platform Canvas size can

here. be set here.
Also add a horizontal line, a back button and an OK button (which can use the cancel and OK return from
form button actions) and set the default button to the OK button.
Do not forget to add a menu item to the main menu to access the new form.
Add the following code to the onFormSubmit method of the form class. This will add the signature image as a
document reference to the latest sales order in the system.

{
DocuValue docuValue;
DocuRef docuRef;
List list;
ListEnumerator listEnumerator;
SalesTable salesTable;
container baseContainer;
BinData binData;
D2MFWSignatureCapture signatureCapture;
str base64data;
;
if(this.getBtnOK().isSubmitTarget(_submitTargetID))
{
list = list::create(this.getSigSignHere().getDocumentContents());
if(list.elements() > 0)
{
listEnumerator = list.getEnumerator();
while(listEnumerator.moveNext())
{
if (listEnumerator.current()=='[]')
throw error ("Please sign");
signatureCapture = new D2MFWSignatureCapture();
signatureCapture.parmSignatureType(this.getSigSignHere().getSignatureType());
signatureCapture.parmCanvas(
this.getSigSignHere().signatureCanvasHeight,
this.getSigSignHere().SignatureCanvasWidth,
5);
signatureCapture.parseData(listEnumerator.current());
signatureCapture.createImage();
base64data = signatureCapture.getBase64Bitmap();
baseContainer = BinData::loadFromBase64(base64data);
binData = new BinData();
binData.setData(baseContainer);
select firstOnly salesTable order by salesTable.salesId desc;

if(!salesTable)
throw error ("no sales orders found!");
docuValue.File = binData.getData();
docuValue.FileName = strFmt('signature-%1.png', salesTable.SalesId);
docuValue.insert();
if (!docuType::find('Image'))
throw error(strFmt("unknown docutype!"));
docuRef.ValueRecId = docuValue.RecId;
docuRef.RefTableId = tableNum(salesTable);
docuRef.RefRecId = salesTable.RecId;
docuRef.RefCompanyId = curext();
docuRef.TypeId = 'Image';
docuRef.Name = 'Customer signature - demo';
docuRef.insert();
}
}
}
return super(_submitTargetID);
}
Now, you are ready to test.
Next, in AX, from accounts receivable, select the last added sales order, and select Attachments from the
ribbon. Then, select the attached document, and select Open from the ribbon.
13. Authorization: Roles and Processes
User roles can be used to configure some basic authorization. Assign a process ID to a menu item to set
authorization. Only users that have this process ID in their assigned role will be able to access this menu item
now.
Set the
Process ID
up here.
For more information on setting up roles/processes, please refer to the Maintenance Guide.
To query authorization from code, use the static method D2MFWCommon::authorization().
14. Sessions and setup
14.1 Active Sessions Form
The Active Sessions form displays the currently connected devices. It also allows you to transfer a session
from one device to another.
Logged Log-on Resolution of Detected Last active Delete sessions that have
Employee. date/time client device. browser. date/time expired (can be batched).
. .
Device IP Events sent Web Current active Check to allow user

addresses. to AX. session ID. process. to transfer session.
To access the framework parameters, go to the option DAW Framework from the main menu, and select
Active Sessions.
For more information, refer to the Dynamics Anywhere framework Maintenance Guide.
14.2 Framework Parameters
To access the framework parameters, go to the option DAW Framework from the main menu, and select
Parameters.
Toggles between just the last line and full info log
on an error.
Prevents users from logging in on multiple devices.
Enables the option to transfer a session from one

device to another.
Check this to transfer a session to another device

Inactivity timeout automatically (otherwise, an operator needs to set
period. this manually on the Active Sessions form).
Sessions will timeout when inactive.
Specifies whether to log all, slow or no

transactions.
Threshold value (in seconds) for what counts as

slow transactions.
Number sequences used by the framework. Refer

to the Installation guide for a description on how
to set them up.
For more information, refer to the Dynamics Anywhere framework Maintenance Guide.
15. Exporting and Deploying a Mobile Application
15.1 Exporting the Mobile Application
To export a Mobile Application, you need to export the user interface data, and the classes that go with
them.
15.1.1 Setting up Data Export

To export the user interface data, use AX data export. From the main menu, select Administration, and under
Periodic->Data Export/Import, open Definition Groups.
If the Definition Group DAWFW does not exist, you can create it by running the job D2MFWCreateExpGroup.
15.1.2 Creating an export group

If the Dynamics Anywhere Framework on this machine just contains a single Mobile Application, or if you
want to export the user data for all available Mobile Applications, you can use the DAWFW export group,
otherwise you need to create an export group for a specific Mobile Application.
To create a specific export group, follow these steps:

1. Create a copy of the DAWFW export group, and give it a name that makes sense to you (in the example
above, DAWFW_SALE has been created to export the sales application).
2. Select the newly copied export group, and select the button Table Setup (AX 2009) or Select Tables (AX
2012)
3. AX 2009: For all of the tables, except D2MFWDeviceType and D2MFWFont, check the Use Export
Criterion checkbox, and select the button Export Criteria.
AX 2012: For all of the tables, except D2MFWDeviceType and D2MFWFont, check the Apply Criteria
checkbox, and select the Export Criteria option from the ribbon.
4. Under export Criteria, set the range for Application Config ID to the ID of the application you wish to
export, and remove any other ranges.
15.1.3 Exporting UI Data

To export the user interface data, use AX data export. From the main menu, select Administration, and
under Periodic->Data Export/Import, select Export To.
Select the export group for the Mobile Application you wish to export, set the file name (once exported,
you cant rename of the exported file or subsequent import will fail), and press OK to export the data.
15.1.4 Exporting the code

To export the classes, find the project for the mobile application under the shared projects in AX. The
name of the project is D2MFW_<your application name>.
Export the project using the export button on the toolbar. Make sure that if you have changes in
multiple layers, and you want to keep those intact upon later import, you make an export for each
layer. If you dont care about keeping the layer structure intact, just export all layers.
Please note, when exporting the Dynamics Anywhere preconfigured solutions, any modifications made
to the supporting classes (that is, classes that are not application or form classes and are not included in
the automatically generated project) need to be exported from the source and imported into the target
AX installation manually, like regular AX customizations.
15.1.5 Store both exports together

As the exported code and the exported data are closely tied together, we recommend keeping the files
of the data export and code export together in a subdirectory or zip file, to prevent accidentally mixing
up mismatching versions.
15.2 Importing the Mobile Application
Please note, to import a modified or new preconfigured solution, the target AX instance needs to
have Dynamics Anywhere installed, refer to the installation and configuration guide for more
information.
15.2.1 Importing UI Data

To export the user interface data, use AX data export. From the main menu, select Administration, and
under Periodic->Data Export/Import, select Import.
Under filename, select the export file for your Mobile Application (see 15.1.3).
Also, make sure you leave the Export Group field empty.
Next, select the advanced tab, and make sure Include System and Shared Tables is checked.
Press OK to import data.
15.2.2 Importing code

To import the export file for the code, open the Project window in AX, and select the Import button
from the toolbar. Select the file containing the code export for the Mobile Application. If you are
updating an existing Mobile Application, make sure you to compare code first to see you dont
overwrite a customization by accident.
15.2.3 Setting the Layer for the UI Data

To maintain integrity between the imported UI Data and the imported code, you should set the Util
Entry Level of the imported UI Data to layer you have imported the code into.
To do this, open the job D2MFWSetUtilLevel then set the value for the variable newUtilEntryLevel to the
layer you imported the code into, and compile and run the job.
16. Notes

DAW DG v5 0 0 1 Development Guide

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

DAW DG v5 0 0 1 Development Guide

Caricato da

Copyright:

Formati disponibili

AX Anywhere Framework

File : DAW DG v5 0 0 1 Development Guide.docx

1.2 Revision history

1.4 What is discussed in This Guide?

DAW Application DAW / Application

Microsoft Dynamics AX Functionality

Business Logic (X++) AX Database

Dynamics Anywhere FW UI Config Form and

3.1 The Application Configuration - Application

The menus configured for

Multi language labels in

3.1.1 Application object layer within framework data

3.1.2 Application properties

3.1.3 Menu properties

See 11.8.1 for information on setting background images for buttons.

3.1.5 Application variables properties

3.2 The Application Configuration - Form

Forms within the

3.2.2 Form variables properties

3.2.3 Form specific actions

Properties for this user

Properties that may vary

3.3.1 Control properties

Property: Append colon

Property: Append newline

Property: Button action

Property: Button action form ID

Property: Clear on load

Property: Clear on reactivate

Property: Data grid select

Property: Get caption from EDT

Property: Include hotkey in caption

Property: Linked variable

Property: Linked variable form id

Property: Selected index

Property: Validate textbox

Property: Text mode

3.3.2 Data grid column configuration

3.3.4 Button actions

Show form (create always)

Show form (create or return)

Return from form

3.3.4.1 Button background images

See 11.8.1 for information on setting background images for buttons.

Start process Capture X Capture Y Done? Yes End Process

3.3.5 Linked Variables

Control Type Allowed Base Type Linked property

3.4 Form Designer (Beta)

3.5 The Application Configuration Framework tab

Definition of available Regular expression allows

Meta tags added here are

Definition of available fonts,

3.6 The Application Configuration Style sheets tab

Definition of the style

4.1 Creating a new application

5. Optionally, you can set up a stylesheet value.

4. Set the main

1. Create the application

4.2.1 Create the hello world form

Literal HTML tags need to be

Causes the form to return to

4.2.2 Configuring the logout form

Add a button, named BtnNo.

Select Yes to log off.