Ana içeriğe geç
Version: 1.4.0

Dependencies

Each component (criterion, grid, chart, etc) can have some dependencies inside affecting its behaviour and contents. A dependency can be launched depending on component conditions or events.

caution

The element must have the component attribute to make it work. If the element does not have the component attribute, the dependency system won´t work properly.

XML skeleton

<dependency initial="[initial]" source-type="[source-type]" target-type="[target-type]" 
server-action="[server-action]" target-action="[target-action]"
label="[label-to-update]" value="[value]" formule="[formule]"
type="[type]" invert="[invert]" async="[async]" silent="[silent]">
<dependency-element ... />
...
<dependency-action .../>
...
</dependency>

Dependency structure

ElementUseMultiples instancesDescription
dependencyRequiredNoGlobal node of the dependency. Defines the dependency attributes
dependency-elementRequiredYesCondition to launch the dependency
dependency-actionOptionalYesAction which will be launched if dependency conditions are valid

Dependency attributes

AttributeUseTypeDescriptionValues
initialOptionalBooleanDependency will be launched on page loadDefault value is false
source-typeOptionalStringDependency source (Where the data will be taken)See source types. Default value is none
target-typeOptionalStringDependency target (Where the dependency will be applied)See target types. Default value is none
server-actionOptionalStringServer action call (when source-type is query)See server action list
target-actionOptionalStringTarget to call on the server / Name of the criterion, to get its value, when source-type is launcher
labelOptionalStringLabel to apply to the targetNote: You can use i18n files (locales)
valueOptionalStringValue to apply to the target
formuleOptionalStringFormule to get the value that will be applied to the target
typeOptionalStringHow to evaluate the conditionsPossible values are and (default) and or.
invertOptionalBooleanInvert the condition evaluationDefault value is false
asyncOptionalBooleanRun the server action asynchronouslyDefault value is false
silentOptionalBooleanRun the server action without showing the loading barDefault value is false

Source type

The source-type attribute refers to the place from we are retrieving the data to apply to the component.

ValueDescription
noneDo nothing (nowhere to retrieve values from)
queryLaunch a query to retrieve values
launcherGet the values from the stored alias defined in target-action
valueGet the values from the value attribute defined on the dependency
labelGet the values from the label attribute defined on the dependency (can be a i18n local)
formuleGet the values from a evaluated formule on the formule attribute defined on the dependency
resetClear the target value

Note: source-type="action" is no more needed. Simply add some dependency-actions to your dependency and they will be launched when conditions are valid.

Target type

The target-type attribute refers to the place where we are applying the data retrieved from the source-type or whatever we want to do with the component where the dependency is.

ActionNeeds dataInverse actionDescription
noneNononeApplies to nothing (default value)
labelYesnoneApplies the source-type retrieved value to the component label
unitYesnoneApplies the source-type retrieved value to the component unit label
iconYesnoneApplies the source-type retrieved value to the component icon
inputYesnoneApplies the source-type retrieved value to the component value
format-numberYesrestore number formatApplies the source-type retrieved value to the criterion number format (for numeric criteria only)
validateYesnoneApplies the source-type retrieved value to the criterion validation
attributeYesnoneSet an attribute defined on target-action with the source-type retrieved value
showNohideShow the component
hideNoshowHide the component
show-columnNohide-columnShow the column (applicable only on columns)
hide-columnNoshow-columnHide the column (applicable only on columns)
enableNodisableEnable the component
disableNoenableDisable the component
set-requiredNoset-optionalSet the criterion as required
set-optionalNoset-requiredRemove the required criterion validation
set-readonlyNoset-editableSet the criterion as read-only
set-editableNoset-readonlyAllow editing the criterion
set-visibleNoset-invisibleSet the component as visible
set-invisibleNoset-visibleSet the component as invisible (similar to hide but keeping the hidden criterion place)
enable-autorefreshYesdisable-autorefreshEnable autorefresh and set the autorefresh timer with the source-type retrieved value
disable-autorefreshYesenable-autorefreshDisable autorefresh and set the autorefresh timer with the source-type retrieved value

Note: Some target-type actions have an inverse action, which is executed when dependency conditions are not accomplished. In this case, it's NOT necessary to add another dependency with the inverse action.

Dependency element

The dependency elements are the definition of the conditions required to launch a dependency.

Dependency element skeleton

<dependency-element id="[id]" column="[column]" attribute="[attribute]" condition="[condition]" row="[row]"
id2="[id2]" column2="[column2]" attribute2="[attribute2]" event="[event]" value="[value]"
optional="[optional]" cancel="[cancel]" alias="[alias]"/>

Dependency element attributes

AttributeUseTypeDescriptionValues
idRequiredStringComponent identifier
columnOptionalStringColumn identifier of the component (applicable on grids)
attributeOptionalStringAttribute to check.See attributes below. Default value is selected
conditionOptionalStringCompare conditionSee dependency element conditions. Default value is is not empty
rowOptionalStringRow number from the grid to check the attribute
id2OptionalStringComponent identifier to compare
column2OptionalStringColumn identifier of the component (appliable on grids)
attribute2OptionalStringAttribute to check.
eventOptionalStringEvent to checkSee events below.
valueOptionalStringValue to check
optionalOptionalBooleanMark the element as optional. It is useful to use its values even if they are emptyDefault value is false
cancelOptionalBooleanCancel the dependency if this element has not been checked (useful for mandatory events)Default value is false
aliasOptionalStringName to apply to the dependency element. Useful for launcher dependency targets
check-valueOptionalBooleanCheck this element values (launch the dependency if this element changes)Default value is true

Dependency element conditions

  • eq Values are equal
  • ne Values are not equal
  • contains Value1 contains value2
  • not contains Value1 doesn't contain value2
  • ge Value1 is greater than or equal than value2
  • le Value1 is less than or equal than value2
  • gt Value1 is greater than value2
  • lt Value1 is less than value2
  • in Value1 is in value2 list
  • not in Value1 is not in value2 list
  • is empty Value1 is empty
  • is not empty Value1 is not empty

Attributes

The attributes are all the data you can retrieve from an AWE component. Depending on the component, you can retrieve distinct information of each one:

ActionApply toDescription
visibleAll componentstrue if component is visible
valueCriteriaGets criterion value. This is the default attribute
textCriteriaGets component visible value
labelCriteriaGets component label
unitCriteriaGets component edit label
editableCriteriatrue if component is editable
requiredCriteriatrue if component is required
selectedValuesSelect and Suggest MultipleGets select criterion selected values number
totalValuesSelectGets select criterion total values number
currentRowGridGets current row identifier
currentRowValueGridGets column value of the current row (not the selected one). This is useful to update row values without a selection
prevCurrentRowGridGets previous row to the current row
prevCurrentRowValueGridGets column value of the previous row to the current row
nextCurrentRowGridGets next row to the current row
nextCurrentRowValueGridGets column value of the next row to the current row
selectedRowGridGets selected row identifier
selectedRowValueGridGets column value of the selected row.
prevRowGridGets previous row to the selected one identifier
prevRowValueGridGets column value of the previous row to the selected one
nextRowGridGets next row to the selected one identifier
nextRowValueGridGets column value of the next row to the selected one
selectedGridNumber of selected rows of the grid
selectedRowsGridNumber of selected rows of the grid
modifiedRowsGridNumber of modified rows of the grid (on multioperation grids)
totalRowsGridNumber of total rows of the grid (records)
hasDataColumnGridtrue if the column defined has any data
emptyDataColumnGridtrue if the column defined is empty
fullDataColumnGridtrue if the column defined is full of data

Note: If you want to retrieve a selectedRowValue from a grid column which isn't editable, you must add an event launcher to make sure the dependency is being launched when selecting a row (i.e. event="select-row")

Events

Some components launch events in some cases. You can capture those events with a dependency element to make them launch the dependency:

EventApply toDescription
clickButton, Context option and ChartsLaunched on element click
select-rowGridLaunched when a row has been selected
before-save-rowGridLaunched before saving a row
save-rowGridLaunched when saving a row
after-save-rowGridLaunched after saving a row
before-cancel-rowGridLaunched before cancel saving a row
cancel-rowGridLaunched when cancel saving a row
after-cancel-rowGridLaunched after cancel saving a row
delete-rowGridLaunched when deleting a row
after-delete-rowGridLaunched after deleting a row
add-rowGridLaunched when adding a row
after-add-rowGridLaunched after adding a row
check-records-savedGridLaunched when checking if records have been saved
check-records-generatedGridLaunched when checking if any records have been generated
check-one-selectedGridLaunched when checking if there is one row selected
check-some-selectedGridLaunched when checking if there is at least one row selected
double-clickChartsLaunched when clicking twice on a chart point
context-menuChartsLaunched when right clicking on a chart point
zoomChartsLaunched when selecting a range (zooming) in a chart

Dependency action

Dependency actions are actions launched when a dependency has been activated and the dependency source-type is action. See actions for more information.

Examples

When a button is clicked, update a criterion with a formule

<dependency initial="true" source-type="formule" target-type="input" 
formule="'Valor' + (parseInt('[ButSetVa1]'.substr(5,1),10) + parseInt('[ButSetVa2]'.substr(5,1),10))">
<dependency-element id="ButSetVa3" event="click" />
<dependency-element id="ButSetVa2" />
<dependency-element id="ButSetVa1" />
</dependency>

Validate if a column value is already at the database

<dependency source-type="query" server-action="unique" target-action="AweKeyUni">
<dependency-element id="GrdKeyLst" column="KeyNam" attribute="currentRowValue" />
</dependency>

Enable a button when there is one row selected on a grid

<dependency target-type="enable" initial="true">
<dependency-element id="GrdKeyLst" attribute="selectedRows" condition="eq" value="1" />
</dependency>

Change the numeric format when a criterion value is 4decimales

<dependency source-type="formule" target-type="format-number" initial="true" 
formule="{vMin: '-999999', mDec: [NumHid], aSign:' JPY', pSign:'s', aPad:true}">
<dependency-element id="Txt" condition="eq" value="4decimales" />
</dependency>

Change the validation of a time criterion

<dependency source-type="value" target-type="validate" value="{textLE:['TimReq']}">
<dependency-element id="CalReq" condition="eq" name="Cal" />
<dependency-element id="Cal" condition="eq" name="CalReq" />
</dependency>

Launch two actions when a criterion value changes

<dependency initial="true">
<dependency-element id="CalReq" />
<dependency-action type="server" server-action="data" target-action="ProAllLst" target="SelReq" />
<dependency-action type="server" server-action="data" target-action="ProAllLst" target="SelMulReq" />
</dependency>

Make a criterion not visible (but keeping the place) when a criterion value is oculta

<dependency target-type="set-invisible" initial="true">
<dependency-element id="Txt" condition="eq" value="oculta" />
</dependency>

Make a criterion editable (not readonly) when a criterion value is edita

<dependency target-type="set-editable" initial="true">
<dependency-element id="Txt" condition="eq" value="edita" />
</dependency>

Fill a criterion unit label with the result of a query when a checkbox gets checked

<dependency source-type="query" target-type="unit" server-action="data" target-action="ModSel">
<dependency-element id="ChkBoxVa2" condition="eq" value="1" />
</dependency>

Show a component when the column value of the selected row of a grid is not equal to awemadora02

<dependency target-type="show" initial="true">
<dependency-element id="GrdSta" column="Als" attribute="selectedRowValue" condition="ne" value="awemadora02"/>
<dependency-element id="GrdSta" event="select-row"/>
</dependency>

Use a dependency just in the selected row

<dependency initial="true" target-type="enable">
<dependency-element id="GridName" attribute="selectedRow" condition="eq" id2="GridName" attribute2="currentRow"/>
</dependency>

Note: If you want to retrieve a selected row value from a grid column which isn't editable, you must add an event launcher to make sure the dependency is being launched when selecting a row (i.e. event="select-row")

Validate a criterion using a Java method

Dependency

<criteria label="PARAMETER_TEXT" id="TxtVal" variable="TxtVal" component="text">
<dependency source-type="query" server-action="validate" target-action="ValidateBankAccount">
<dependency-element id="TxtVal"/>
</dependency>
</criteria>

Query

<query id="ValidateBankAccount" service="ValidateBankAccount">
<variable id="BankAccount" type="STRING" name="TxtVal" />
</query>

Service

<service id="ValidateBankAccount">
<java classname="com.almis.awe.test.Validation" method="validateBankAccount">
<service-parameter type="STRING" name="BankAccount" />
</java>
</service>

Java method

public class Validation {

// PATTERNS
private static final String BANK_ACOUNT = "^[0-9]{4}\\-[0-9]{4}\\-[0-9]{2}\\-[0-9]{10}$";
private static final Pattern BANK_ACCOUNT_PATTERN = Pattern.compile(BANK_ACOUNT, 0);

public ServiceData validateBankAccount(String bankAccount) throws AWException {
ServiceData check = new ServiceData();
Matcher matchAccount = BANK_ACCOUNT_PATTERN.matcher(bankAccount);
if (!matchAccount.matches()) {
check.setType(AnswerType.WARNING);
check.setMessage(LocalSingleton.getInstance().getLocal("ERROR_MESSAGE_WRONG_BANK_ACCOUNT", bankAccount));
}
return check;
}
}

Add a class to a HTML element when an event occurs

Bell Animation

Sometimes we need to show an advice in the screen to notice users that something has happened in the back-end such as a new entry in the database or similar. We are going to explain how to add two class names ("animated" and "faa-slow" to set the animated speed) to an HTML element to animate a bell icon and show a number over the icon that represents a number of errors in the application. By pressing this button the bell stops the animation and shows a dialog with a grid showing the error details.

Definition of the screen elements

First we must define the HTML element in the screen xml, in this case an "info-button" element with an attribute "icon" with a "bell" value and a "unit" attribute. This last attribute will represent the number of errors in the application.

  <info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
...
</info-button>

The following step is to add the action to stop the bell animation (removing the class name) and show the dialog.

  <info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
<button-action type="remove-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
<button-action type="dialog" target="MessageWarnings" />
</info-button>

The first button-action removes the "animated" and "faa-slow" class names from the HTML element pointed in the "target" attribute, in this case the element with class name "fa-bell" inside the element with "Warnings" id.

The second button-action opens the dialog with the "MessageWarnings" id.

This actions are triggered when the user click in the button.

Now we must add the required dependencies to show the numbers of errors and add the "animated" and "faa-slow" class names. This actions must run when the users enter in the screen or log in to the application so we are going to add an aditional action.

<info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
<button-action type="remove-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
<button-action type="dialog" target="MessageWarnings" />
<dependency source-type="launcher" target-type="unit" target-action="notification" initial="true">
<dependency-element id="NotificationNumber" alias="notification"/>
</dependency>
<dependency>
<dependency-element id="NotificationNumber" attribute="value" condition="ne" value="0" />
<dependency-action type="add-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
</dependency>
</info-button>

The first dependency is a "launcher" type that runs when the user enters in the screen where this element is defined thanks to the "initial" attribute set to "true". The dependency, points to the "unit" attribute of the info-button and depends on an element with a "NotificationNumber" id represented in the "dependency-element" tag. This new element will be created in following steps.

The second dependency is an "action" type. This action will be triggered when the value of the "dependency-element" (the element with a "NotificationNumber" id) is not equal (ne) to zero. This is represented with the following attributes: attribute="value" condition="ne" value="0". The action for this dependency is an "add-class" type so when this action runs, a class name will be added to an element. This action points to the element with class name "fa-bell" inside the element with "Warnings" id ("target" attribute in the dependecy-action tag) so this element will receive the class name described in the "target-action" attribute ("animated faa-slow").

Now we are going to define the dependency element "NotificationNumber". This element will be a hidden criteria and has an "initial-load" attribute defined to "value" and a "target-action" that points to a query that must be defined in the "Queries.xml" in AWE.

<criteria id="NotificationNumber" component="hidden" initial-load="value" target-action="getNotificationErrors" />

And last but not least the dialog definition.

<dialog id="MessageWarnings" modal="true" style="modal-lg" label="SCREEN_TEXT_WARNINGS" icon="exclamation-triangle" help="HELP_SCREEN_TEXT_PRINT_EMAIL">
<tag type="div" style="modal-body row">
<window label="BUTTON_NOTIFICATIONS" icon="bell" expandible="vertical">
<grid id="GridMessageWarning" style="height-lg" max="50" server-action="data-silent" target-action="getErrorMessageInfo" autoload="true" autorefresh="30">
...
columns definition
...
</grid>
</window>
</tag>
</dialog>

At this point we created all the necesary elements in the screen. The following step is to define the queries that fetch the data from the database.

Queries

In the "Queries.xml" file we must define the following tags:

<query id="getErrorMessageInfo" service="getErrorMessageInfo"/>
<query id="getNotificationErrors" service="getErrorMessageInfo">
<field id="errors" alias="value" />
<field id="errors" alias="label" />
</query>

The first query points to a service called "getErrorMessageInfo" defined in the "Services.xml" file in AWE. This query will be launched by the grid created in the dialog.

The second query points to the same service and expects two values one for a "value" field and other for a "label" field. This query will be launched by the hidden criteria.

Service

Once the queries are defined and points to a service we must create this service. In the "Services.xml" file we must define the following tags:

<service id="getErrorMessageInfo">
<java classname="com.isban.smgmi.web.controller.ErrorMessageController" method="getErrorMessageInfo">
</java>
</service>

This service launch the "getErrorMessageInfo" method in the "com.isban.smgmi.web.controller.ErrorMessageController" class.

Java

In the Controller we must create the "getErrorMessageInfo" method and must return a ServiceData object. This controller must call to a Manager class.

public class ErrorMessageController extends AWEController {
public ServiceData getErrorMessageInfo() throws AWException {

// Get event manager
ErrorMessageManager errorMessageManager = new ErrorMessageManager();

return errorMessageManager.getErrorMessageInfo();
}
}

In the Manager definition we must create a fill client action to load data in the dialog grid and a select client action to load data in hidden criteria.

public class ErrorMessageManager extends AWEManager {

/**
* Get error info
*
* @return
* @throws AWException
*/
public ServiceData getErrorMessageInfo() throws AWException {
...
ClientAction fillErrorGrdAction = new ClientAction("fill");
fillErrorGrdAction.setSilent("true");
fillErrorGrdAction.setTarget("GridMessageWarning");

DataList errorGrdParametersDatalist = new DataList();
Integer rowIndex = 0;
for (ErrorBean error : errorList) {
HashMap<String, CellData> parametersRow = new HashMap<String, CellData>();
parametersRow.put("id", new CellData(rowIndex));

...
// add columns data
...

errorGrdParametersDatalist.getRows().add(parametersRow);
rowIndex++;
}
// Set records
errorGrdParametersDatalist.setRecords(rowIndex);

fillErrorGrdAction.addParameter("datalist", errorGrdParametersDatalist);

// Notification Number
ClientAction selectCrtNotificationNumberAction = new ClientAction("select");
selectCrtNotificationNumberAction.setTarget("NotificationNumber");
selectCrtNotificationNumberAction.setSilent("true");

errorListSize = errorList.size();
ArrayNode notifNumberArrayNode = JsonNodeFactory.instance.arrayNode();
notifNumberArrayNode.add(String.valueOf(errorListSize));
selectCrtNotificationNumberAction.addParameter("values", new CellData(notifNumberArrayNode));

// Adds clients actions
serviceData.addClientAction(selectCrtNotificationNumberAction);
serviceData.addClientAction(fillErrorGrdAction);
...
}