Here is the file structure of XUI flow:
Do the following steps to apply a credit card:
<xuiState id="creditCardsWellcome" type="page" typeIdInfo="jar:///xui/firstStep.xui"> <transitions> <transition context="creditCardsWellcome_history_Ctx" id="creditCardsWellcome.history" targetState="creditHistoryOpState" /> </transitions> </xuiState>
The type page means this xui state is a XUI page, the typeIdInfo is the xui file location, you can use fromJAR way to access it. The transitions describe the state transition according to the output.
public class RadioButtonInitializer implements IInitializer { public void initialize(IXUIWidget widget) { // Get the radio button using widget id XUIRadioButton btn = (XUIRadioButton) widget.getXUIView().getXUIWidget( "accountRadio"); //Set the enable property of input widget ((XUIText) widget).getWidget().setEnabled( btn.getWidget().getSelection()); } }
After you implement the Initializer you can configure it in XUI editor, click the input text widget, then you can set the initializer in initializer tab view.
public class AccountValidator extends Validator { public String validate(IXUIWidget widget, String text) { XUIRadioButton radio = (XUIRadioButton) widget.getXUIView() .getXUIWidget("accountRadio"); if (radio.getWidget().getSelection()) { if (text == null || text.length() != 8) { return "Account Number's length should be 8"; } } return null; } }
After click the account input text widget, you can configure the validator in XUI editor.
public class CreditHistoryOperation extends com.ibm.btt.base.BTTClientOperation { public void execute() throws Exception { // Get the cs client service CSClientService csClientService = CSClient.getCSClient("realCSClient"); //communicate with the server side csClientService.sendAndWait(this, 60000); OperationRepliedEvent event = new OperationRepliedEvent(this); Hashtable ht = new Hashtable(); event.setParameters(ht); String accountExist = (String) getContext().getValueAt("TrxReplyCode");//$NON-NLS-1$ //Check the reply code if ("true".equals(accountExist)) { //Trigger the processor to accountExists state ht.put(ExecuteOperationAct.EXIT_EVENT_NAME, "accountExists");//$NON-NLS-1$ } else { // Trigger the processor to newAccount state ht.put(ExecuteOperationAct.EXIT_EVENT_NAME, "newAccount");//$NON-NLS-1$ } //fire the event fireHandleOperationRepliedEvent(event); } }
The check account history operation is an operation state; you can configure it in the XUI processor like below:
<!-- Operation state. The operation is executed by the specialized state. The operation is firing the exit events --> <state id="creditHistoryOpState" type="operation"> <entryActions> <executeOperationAct id="creditHistoryAct" linkContextTo="processor" operationName="creditHistoryOp" /> </entryActions> <transitions> <transition id="creditHistoryAct.accountExists" targetState="creditCardsPage" /> <transition id="creditHistoryAct.newAccount" targetState="financialInfoState" /> <transition id="creditHistoryAct.error" targetState="finalNotOk" /> </transitions> </state>
<xuiState id="financialInfoState"> <entryActions> <executeXuiSubflowAct id="initialStep" processor="financialInfoProc" /> </entryActions> <transitions> <transition id="initialStep.ok" outputMapFmt="financialInfoToCreditApplFormat" targetState="creditCardsPage" /> <transition id="initialStep.notOK" outputMapFmt="errorMessagesMapper" targetState="finalNotOK" /> <transition id="initialStep.canceled" targetState="creditCardsWellcome" /> </transitions> </xuiState>
The user can choose continue processing application or cancel application in this page, so the continue button will trigger different event according to user’s selection . We can implement this action like below.
public class SampleEventAction extends Action { @Override public boolean widgetSelected(IXUIWidget widget) { IXUIView view = widget.getXUIView(); IModelAdapter model = view.getModel(); //Get user’s selection from the data model of the view String state = (String) model.getValueAt("dse_nextEventName"); //fire the event according to user’s selection view.fireXUIEvent(new XUIEventObject(widget, Constants.STATE_CHANGE,state)); return super.widgetSelected(widget); } }
Then we can configure it in the XUI editor.
After click the Continue button, then you can configure actions in the actions view.