Mobile/Pocket PC Web Pages - How to create a mobile web form

Is the web mobile development still relevant in IFS Applications8? If so, should the screen shots be updated

• Introduction
• Mobile Browser Limitations
• Framework Limitation
• Basic Workings of a Page
• Developer Precautions
• Creating Navigators
• Mini Mobile Web Framework API

Introduction

IFS Mobile web forms are light weight web pages suitable for viewing through mobile devices. Most of the mobile devices today (e.g.: Phones, PDA;s, Pocket PC's) comes with a built in web browser. The ability to use IFS Applications from a mobile device provides great versatility and flexibility. The figure shows how a simple mobile web page query dialog is displayed on a mobile web browser.

In this tutorial we will look into how a mobile web page is developed using the IFS Web Client framework. The basic development concepts are the same as a normal web page. So we would only look at the specific development differences between Mobile web forms and Basic web forms.

Mobile Browser Limitations

Since we are talking about web pages that load onto mobile web browsers, we are limited to a basic level of development capabilities. As an example mobile browsers don't support popup browser windows or DHTML. For a detailed list of such limitation visit Mobile Limitations link.

Framework Limitations

Due to the above PDA limitations some of the framework option and functionalities are not supported on the mobile webclient framework. The following is a list such supported and non-supported functionalities as compared to the main webclient framework. As the mini framework is fairly new, the list is expected to change overtime.

Supported Functionalities

• Supports up to Master Detail forms.
• Working flow (as end-user) is exactly as web client
• Start with intro page ( but developers can start their pages in find layout – basically in any layout)
• All standard actions (new/edit/delete/populate) are supported.
• To edit/delete – should go to single lay mode (limitation with popup – no action menu)
• All custom row actions defined by users (i.e. Close, Cancel …) will be shown as Hyperlinks in single mode. (limitations with popup menu solution)
• Validation (using AJAX, exactly as we do in IFS Web Client)
• Can add Navigator node from the module
• Help pages (window descriptions).
• Multi language support (Same as IFS Web Client).
• Save Queries are supported

Non-Supported Functionalities

• LOV/Date pickers support ( technical limitation – no support for popup windows in a PDA)
• Profiles
  • Base Profiles
  • Hide menus/columns/row actions (configurable screen layouts)
  • Default values
• Personal Portal ( will never be supported)
• Expandable navigator trees
• Tabs on pages
   

Basic Workings of a Page

From a developers point of view apart from a few changes, everything else is the same as a basic web form.

1. All mobile web pages have to extend the MobilePageProvider class instead of the ASPPageProvider class. The MobilePageProvider class is an extension of ASPPageProvider with functionality to support light weight mobile environments.

  package ifs.demorw;

  import ifs.fnd.asp.*;
  import ifs.fnd.buffer.*;
  import ifs.fnd.service.*;
  import ifs.fnd.*;
  import ifs.fnd.webmobile.web.*;

  public class OrderHeader extends MobilePageProvider
  {

     //===============================================================
     // Static constants
     //===============================================================
     public static boolean DEBUG = Util.isDebugEnabled("ifs.demorw.OrderHeader");

     ...
  }



2. To display the page the printContents( ) method needs to be modified as followed.

  protected void printContents() throws FndException
  {
     ASPManager mgr = getASPManager();
     appendToMobileHTML(lay.show());
  }

With the appendToMobileHTML( ) function you can append html-code to the page. The show() function on the ASPBlockLayout object displays the block. When displaying a block on a mobile page the framework will override the show( ) function with a similar function on the MobileBlockLayout class. This class handles all the block layout related functions relating to mobile web pages. Good news is you don't need to worry about it, the framework does it for you.



3. Besides the previous changes all other methods to create a page stays the same. For a full list of methods that you can use to create mobile WebPages check the following link.
   
   Functionality Provided by MobilePageProvider

Developer Precautions

As the mobile device is a limited resource environment, it is always best to keep things simple. The following few tips should get you going..!

1. Keep content as small & simple as possible
   
   
2. Keep descriptions, field names and labels short and simple. Longer text might cause the browser to wrap text within the tables used to format the page.
   
   
3. Since there is no popup menu support custom commands are shown in the single layout mode, thus keep custom commands to a minimum or else it might clutter the page content.
   
   

Creating Navigators

Modules can simply provide their navigator node using the new interface introduced in the framework. The framework then scans for such classes and constructs the Navigator.

  package ifs.module;

  import ifs.fnd.asp.*;
  import ifs.fnd.webmobile.web.*;
  
  public class moduleMobileNavigator implements MobileNavigator
  {
     public ASPNavigatorNode add(ASPManager mgr)
     {
       ASPNavigatorNode nod = mgr.newASPNavigatorNode( "Module" );
       nod.addItem( "TRANSLATABLECONSTANTXX: Example Page", "module/mobile/example.page");
       return nod;
     }
  }

Mobile Web Framework API

Mobile Web framework API