Sunday 13 August 2017

How to create Conditional Fields in IBM Anywhere?

How to create Conditional Fields in IBM Anywhere?

This article explains the steps to make a field mandatory based on a condition. 


For a workorder, when the status has been changed to Hold from another status, the “Memo” field should become mandatory and if the memo field is not filled then app should throw an error message. For the other statuses “Memo” field is not mandatory.


To implement the above requirement you need to specify an event handler in the app.xml file to make the “Memo” field mandatory which depends on value of status field selected by mobile user.

   1.     Open the app.xml for the app that you want to update and make the following changes
a.     Add the custom message to show when the “Memo” field is empty

<messages id="messages">
<message defaultMessage="Please fill in the Memo Field" id="MemoValidation"/>

b.    In the Status Change Container of the  app.xml, add a Validate type of event handler to the “New Status” field
                                          i.    In the <text> element of the new field, add a child element named <eventHandlers>.
                                         ii.    In the <eventHandlers> element, add a child element named <eventHandler>.
                                        iii.    Specify Vaidate as the event attribute, and add the method and class attributes.

 <container id="WorkExecution.EditStatusView_statusChangeResource_container_0" resource="statusChangeResource">
                                                <group id="WorkExecution.EditStatusView_group_1">
                                                            <groupitem id="WorkExecution.EditStatusView_statusChangeResource_groupitem_0">
                                                                        <text editable="true" id="WorkExecution.EditStatusView_statusChangeResource_groupitem_0_changedate_StatusDate" label="Status Date" placeHolder="Select" required="true" resourceAttribute="changedate"/>
                                                            <groupitem id="WorkExecution.EditStatusView_statusChangeResource_groupitem_1">
                                                                        <text editable="false" id="WorkExecution.EditStatusView_statusChangeResource_groupitem_1_statusdesc_NewStatus" label="New Status" lookup="WorkExecution.statusLookup" placeHolder="Select from list" required="true"  resourceAttribute="statusdesc">
                                                                                    <eventHandlers id="WorkExecution.EditStatusView_statusChangeResource_groupitem_1_statusdesc_NewStatus_eventHandler">
                                                                                                <eventHandler class="application.handlers.StatusChangeHandler" event="validate" id="WorkExecution.EditStatusView_statusChangeResource_groupitem_1_statusdesc_NewStatus_eventHandlers_validate" method="makeMemoMandatory"/>
                                                            <groupitem id="WorkExecution.EditStatusView_statusChangeResource_groupitem_2">
                                                                        <text editable="true" id="WorkExecution.EditStatusView_statusChangeResource_groupitem_2_memo_Memo" label="Memo" placeHolder="Tap to enter" resourceAttribute="memo"/>

            2.     Apply the condition for the event handler to StatusChangeHandler  javascript file or you can
                  create your own custom javascript file and add the below logic

makeMemoMandatory: function(eventContext){
                                  var workOrder=eventContext.getCurrentRecord();
                                  var statusChange = CommonHandler._getAdditionalResource(eventContext,"statusChangeResource").getCurrentRecord();
                                  var newStatus=statusChange.get("status");
                                  var currMemo = statusChange.get("memo");                                         
                                  if (newStatus == "HOLD" && currMemo == null){
                                                 var fieldMetadata = statusChange.getRuntimeFieldMetadata("memo");
                                                 fieldMetadata.set('required', true);                                                        
                                  }else if(newStatus !== "HOLD"){
                                                 var fieldMetadata = statusChange.getRuntimeFieldMetadata("memo");
                                                 fieldMetadata.set('required', false);

       3.     Add the following code in commitWOStatusChange method of StatusChangeHandler.js to check   
             if the Memo field is empty or not

var currMemo = statusChange.get("memo");                                            
if (newStatus == "HOLD" && currMemo == null){
   throw new PlatformRuntimeException("MemoValidation");
 4.     Save your changes and preview the updated mobile app in a mobile browser simulator.

No comments:

Post a Comment