Hello team,
I have question that there are 2 tabs and inside it there is available 3 fields. For example, we have MainTab and AdditionalTab and inside MainTab there is firstname, lastname, middlename. Inside AdditionalTab there is Phonenumber, email, birthdate. I need to put validation to this fields separately. If I put validation to firstname and Phonenumber, these two shouldn't affect each other. when Firstname and Phonenumber is not filled in and try to save record, if I am on Maintab, system should return Firstname validation. at the same time, when I change tab to AdditionalTab, system should return Phonenumber validation. in this case how can I put validation based on tabs?
Below I'll share written code for validation.
define("UsrExample1Page", ["ConfigurationConstants"], function(ConfigurationConstants) {
return {
entitySchemaName: "UsrExample",
attributes: {
"CurrentActiveTab": {
dataValueType: Terrasoft.DataValueType.TEXT,
type: Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
value: "" // Initial value, empty by default
}
},
details: /**SCHEMA_DETAILS*/{
"Files": {
"schemaName": "FileDetailV2",
"entitySchemaName": "UsrExampleFile",
"filter": {
"masterColumn": "Id",
"detailColumn": "UsrExample"
}
}
},
methods: {
onActiveTabChange: function(activeTab) {
// Store the active tab identifier
this.set("CurrentActiveTab", activeTab);
},
setValidationConfig: function() {
this.callParent(arguments);
this.addColumnValidator("UsrName", this.nameFieldsValidator);
//this.addColumnValidator("UsrLastName", this.nameFieldsValidator);
this.addColumnValidator("UsrPhoneNumber", this.phoneFieldsValidator);
},
nameFieldsValidator: function(value, column) {
var invalidMessage = "";
var firstName = this.get("UsrName");
console.log("Name:", firstName);
if (Ext.isEmpty(firstName)) {
invalidMessage = this.get("Resources.Strings.InvalidNameMessage");
// Switch to the tab containing the first name field
console.log("Switching to name tab:", invalidMessage);
this.set("CurrentActiveTab", "Tabbfc229c0TabLabel"); // Assuming "NameTab" is the tab identifier
}
return { invalidMessage: invalidMessage };
},
phoneFieldsValidator: function(value, column) {
var invalidMessage = "";
var phoneNumber = this.get("UsrPhoneNumber");
console.log("Phone number:", phoneNumber);
if (Ext.isEmpty(phoneNumber)) {
invalidMessage = this.get("Resources.Strings.InvalidPhoneNumberMessage");
console.log("Switching to phone tab:", invalidMessage);
this.set("CurrentActiveTab", "Tab68b5b8f6TabLabel"); // Ensure this is correct
}
return { invalidMessage: invalidMessage };
}
},
dataModels: /**SCHEMA_DATA_MODELS*/{}/**SCHEMA_DATA_MODELS*/,
diff: /**SCHEMA_DIFF*/[
{
"operation": "insert",
"name": "Tabs",
"values": {
"tabs": [
{
"name": "MainTab",
"caption": { "bindTo": "Resources.Strings.MainTabCaption" },
"items": [],
"change": { "bindTo": "onActiveTabChange" }
},
{
"name": "AdditionalTab",
"caption": { "bindTo": "Resources.Strings.AdditionalTabCation" },
"items": [],
"change": { "bindTo": "onActiveTabChange" }
}
]
}
}
]/**SCHEMA_DIFF*/
};
});
