How to dynamically show/hide the Page elements (textbox, checkbox, etc.) based on a selected value from Lookup in 7.4?
I can't figure out how to show/hide the Page elements (textbox, chechbox, etc.) on a Tab based on a selected value from a Lookup on the Page. Can someone help me with this?
Like
Hi Mark, you can implement this logic using business rules (simple cases) or just binding field "visible" property to some method or property (in case of complicated logics):
1) Rules:
Please load BusinessRuleModule specifying its name in define method arguments and require function:
define("AccountPageV2", ["BusinessRuleModule"], function(BusinessRuleModule) {
then add appropriate business rule to rules block using the following template:
rules: {
"ActivityCategory": { //name of field, which may be hidden or not
"BindParameterVisibleActivityCategoryToType": { //business rule name
"ruleType": BusinessRuleModule.enums.RuleType.BINDPARAMETER,
"property": BusinessRuleModule.enums.Property.VISIBLE,
"conditions": [
{
"leftExpression": {
"type": BusinessRuleModule.enums.ValueType.ATTRIBUTE,
"attribute": "Type" //lookup column name, which item will be selected
},
"comparisonType": Terrasoft.ComparisonType.EQUAL,
"rightExpression": {
"type": BusinessRuleModule.enums.ValueType.CONSTANT,
"value": "fbe0acdc-cfc0-df11-b00f-001d60e938c6" //Identificator of record in lookup, which should hide field
}
}
]
}
}
}
2) Method or property
Please add "visible" property to field definition in diff[] block, like in code below:
{
"operation": "insert",
"parentName": "JobTabContainer",
"propertyName": "items",
"name": "InternalRate",
"values": {
"itemType": Terrasoft.ViewItemType.DETAIL,
"visible": {
"bindTo": "IsVisible"
}
}
}
register an attribute to process lookup value change:
attributes: {
"Type": { //name of lookup column
dependencies: [{
columns: ["Type"], //name of column, editing of which should fire method
methodName: "getRateDetailsVisible"
}]
}
}
then please add method and decide if you want to show some field or not, setting true or false values to "IsVisible" property
methods: {
getRateDetailsVisible: function() {
if (this.get("Type")) {
this.set("IsVisible", this.get("Type").value === ConfigurationConstants.ContactType.Employee);
}
this.set("IsVisible", false);
}
}