How to validate a date picker component by editing from source code?
"usr.FutureDateValidator": {
validator: function (config) {
return function (control) {
let value = control.value;
// This part right here //
if (value.readonly) {
return null;
}
let selectedDate = value instanceof Date ? value : new Date(value);
let today = new Date();
today.setHours(0, 0, 0, 0);
selectedDate.setHours(0, 0, 0, 0);
let valueIsCorrect = selectedDate >= today;
return valueIsCorrect ? null
: {
"usr.FutureDateValidator": {
message: config.message
}
};
};
},
params: [{ name: "message" }],
async: false
}This is a custom validation I made to validate a "Date Picker" component only for today and the following days. So it is unable to use past dates.
The problem occured when modifying the field's value after I save, then modifying another field that is not the date picker, it will run this custom validation again. So if the data was saved the previous days, this custom validation will validate that date picker field.
The question is how do I read the value's "Read-Only" so I can turn off the validation when its value is 'true'?
Or if there is a better way to configure this validation, I will be happy to change it.
Notes:
- This is a custom package (outside creatio's source package)
- Validate this field before it is saved
- After saving, the validation is turned off
- More than one is using this validation
- If possible, can edit it ONLY when the field (date picker) is edited (not other fields)
Thanks for helping, ask me more questions if the information is not enough.
Like
You can turn on/off the validator so it only applies under the scenario you'd like.
Turn on:
request.$context.enableAttributeValidator("TheAttributeName", "TheValidatorName");Turn off:
request.$context.disableAttributeValidator("TheAttributeName", "TheValidatorName");Note, the validator name there is whatever you named it when added to the attribute (which might not be the same as the actual validator). I don't know enough about the scenario, but if this is only something that would be populated when adding a new record maybe something like this would work?
{
request: "crt.HandleViewModelInitRequest",
handler: async (request, next) => {
await next?.handle(request);
const cardState = await request.$context.CardState;
if (cardState == "add" || cardState == "copy") {
// enable the validator here
}
else {
// disable the validator here
}
}
}Ryan
You can turn on/off the validator so it only applies under the scenario you'd like.
Turn on:
request.$context.enableAttributeValidator("TheAttributeName", "TheValidatorName");Turn off:
request.$context.disableAttributeValidator("TheAttributeName", "TheValidatorName");Note, the validator name there is whatever you named it when added to the attribute (which might not be the same as the actual validator). I don't know enough about the scenario, but if this is only something that would be populated when adding a new record maybe something like this would work?
{
request: "crt.HandleViewModelInitRequest",
handler: async (request, next) => {
await next?.handle(request);
const cardState = await request.$context.CardState;
if (cardState == "add" || cardState == "copy") {
// enable the validator here
}
else {
// disable the validator here
}
}
}Ryan
Ryan Farley,
Hi Ryan,
Thank you for the suggestion. I appreciated that you showed me another way to handle the validation.
It is indeed convincing to use it based on the scenario I would use. But after I tried implementing it onto my page, it seems the "... disableAttributeValidator..." is not active.
Therefore my "FutureDateValidator" is still on and validating the field. I edit the handler similar to your example. This is one of the example field I use to handle it:
const fieldDateState1 = await request.$context.PDS_UsrMeetingDate_e6xd3ts;
if (fieldDateState1 === null || fieldDateState1 === undefined || fieldDateState1 === "") {
request.$context.enableAttributeValidator("PDS_UsrMeetingDate_e6xd3ts", "FutureDateValidator");
} else {
request.$context.disableAttributeValidator("PDS_UsrMeetingDate_e6xd3ts", "FutureDateValidator");
}Is this correct? Because it is not working as I explained.
Do you have any more ways to configure this ?
Thanks for helping. I'm still open to more suggestions.
Oh I have found the issue.
It was because I use "crt.HandleViewModelInitRequest", instead of "crt.HandleViewModelAttributeChangeRequest".
Thanks for your help!
Ryan Farley,
Hi Ryan,
I forgot to ask about which attribute is to detect the "Read Only" value using source code:
const isReadOnly = await request.$context.PDS_UsrMeetingDate_e6xd3ts_readonly;
// OR
const isReadOnly = await request.$context.PDS_UsrMeetingDate_e6xd3ts?.readonly;
// OR
const isReadOnly = await request.$context.PDS_UsrMeetingDate_e6xd3ts?.isReadOnly;
// OR other way to use it?Thanks again!