Full JSON Object Structure
{
"fields": [
{
...
...
"validators": {
"validation": [
{
"name": "compareDateFields",
"options": {
"fieldKeys": {
"SurveystartdateCV7vp": [
{
"message": "Survey End Date should be after the Survet Start Date",
"fieldKey": "SurveyenddateCV7vp",
"comparator": "before"
}
]
}
}
}
]
},
"fieldGroup": [
{
"key": "ResearchdetailsOILdA",
"id": "formly_112__ResearchdetailsOILdA_1",
"type": "formly-group",
"props": {
"label": "Research details",
"disabled": false,
"placeholder": ""
},
"fieldGroup": [
{
"key": "ProjectdetailseYs46",
"id": "formly_113_block_ProjectdetailseYs46_0",
"type": "block",
"props": {
"label": "Project details",
"placeholder": ""
},
"fieldGroup": [
{
"key": "SurveystartdateCV7vp",
"id": "formly_125_customdatepicker_SurveystartdateCV7vp_2",
"type": "customdatepicker",
"props": {
"label": "Survey Start Date",
"minDate": {
"day": 1,
"year": 2022,
"month": 1
},
"placeholder": "Enter Survey Start Date",
"addRemoveTimeMinDate": "60:d"
},
"validation": {
"messages": {
"invalid": "Invalid date entered for Survey Start Date",
}
},
},
{
"key": "SurveyenddateCV7vp",
"id": "formly_125_customdatepicker_SurveyenddateCV7vp_3",
"type": "customdatepicker",
"props": {
"label": "Survey End Date",
"placeholder": "Enter Survey End Date",
"addRemoveTimeMinDate": "61:d"
},
"expressions": {
"props.required": "!field?.hide && field?.props?.defaultRequired"
},
"validation": {
"messages": {
"invalid": "Invalid date entered for Survey End Date",
}
}
}
]
}
]
}
]
}
]
}
This should be set at the top most level sections . Make sure the fields you are comparing are not disabled you may alternatively make them readonly if you want to prevent the user from interacting with them.
For the validator’s options, pass in a list of fieldKeys to be validation with each of them having their own array own array of fields that should be compared to the main key.
...
...
"validators": {
"validation": [
{
"name": "compareDateFields",
"options": {
"fieldKeys": {
"{{ fieldKey_1 }}": [
{
"fieldKey": "{{ targetFieldKey_1_A }}",
"message": "validation message as applies to this target key",
"comparator": "before | after | beforeOrEquals | afterOrEquals"
}
],
"{{ fieldKey_2 }}": [
{
"fieldKey": "{{ targetFieldKey_2_A }}",
"message": "validation message as applies to this target key",
"comparator": "before | after | equals | beforeOrEquals | afterOrEquals"
}
],
...
...
}
}
}
]
},
...
...
Each comparison array has properties to define the target key, the validation message as it applies to that comparison, and the comparator ( any of before | after | equals | beforeOrEquals | afterOrEquals):
Example of a comparison condition:
In the example below, e are validating that the field key fieldKey_1 has a date that must be beforeOrEquals to targetFieldKey_1_A .
...
...
"fieldKeys": {
"{{ fieldKey_1 }}": [
{
"fieldKey": "{{ targetFieldKey_1_A }}",
"message": "validation message as applies to this target key",
"comparator": "before | after | equals | beforeOrEquals | afterOrEquals"
}
],
...
}
}
...
...
Comparison properties
See compareDateFields in the maintained Validators reference.