How to check AMX page is fully loaded or not

Sometimes you might requires to manipulate the HTML elements after the page is fully loaded. In HTML file it an be checked using window.onload or deviceready but same doesn't guarantees the appropriate ADF Mobile state.

In ADF mobile using showpagecomplete event on the handlePageShown callback function it can be checked.

<script>
        function handlePageShown() {
          console.log("Page is shown!");
        }
        document.addEventListener("showpagecomplete", handlePageShown, false);
</script>

The showpagecomplete event guarantees the appropriate ADF Mobile state; other browser and third-party events, such as load and Cordova's deviceready, may not.

In my next article I will show the usage of showpagecomplete event with example.

ADF Mobile - Get network status dynamically

While working on ADF mobile application with offline/online capabilities, before calling webservices network has to be checked whether it is "connected" or "disconnected".

In my previous article Offline Data Synchronization for ADF Mobile, I was using the javascript to evaluate the network connectivity and store the connection status in pageFlowScope variable. But after subsequent checks pageFlowScope variable was not refreshing properly. Please see the oracle forum for more info,  ADF Mobile - Get network status.

Steps to check network status dynamically:-

1. Java Script to check the network status

 /**
  * Method to check the network status
  */
  application.checkConnection = function () {
     var isConnected;
     var connectionType = navigator.network.connection.type;
     var states = {
      };
     states[Connection.UNKNOWN] = 'Unknown connection';
     states[Connection.ETHERNET] = 'Ethernet connection';
     states[Connection.WIFI] = 'WiFi connection';
     states[Connection.CELL_2G] = 'Cell 2G connection';
     states[Connection.CELL_3G] = 'Cell 3G connection';
     states[Connection.CELL_4G] = 'Cell 4G connection';
     states[Connection.NONE] = 'No network connection';
     if (connectionType == Connection.NONE || connectionType == Connection.UNKNOWN) {
        isConnected = false;
     }else {
        isConnected = true;
     }
     var obj = {connectionType : connectionType, isConnected : isConnected};
     return obj;
  }

2. In managed bean call the application.checkConnection method

public void checkNetworkStatusAction(ActionEvent actionEvent) {
String networkDetails = (String)AdfmfContainerUtilities.invokeContainerJavaScriptFunction(AdfmfJavaUtilities.getFeatureName(),"application.checkConnection",new Object[] { });
   try {
        JSONObject obj = new JSONObject(networkDetails);
        String connectionType = (String)obj.getString("connectionType");
        boolean isConnected = (boolean)obj.getBoolean("isConnected");
        setIsConnected(isConnected);
        setConnectionType(connectionType);
    } catch (JSONException e) {
        throw new AdfException("Error while trying to connect to network", AdfException.ERROR);
    }
}

Application screen looks like below when it deployed to Android device, When there is no network available in the device.

Enable the Mobile Data or Wireless and click on the Check button, Connection Type and Network Status will be displayed on the screen.

You can download the sample workspace from here
[Runs with Oracle JDeveloper 11.1.2.4.0]