[Custom Masks] Date Mask with On Change Inputs

Hello guys,

I've come across an issue when using the Date Mask with an input that has an On Change event associated with it. Whenever I try to manually enter the date, the On Change event is triggered as expected but the cursor jumps to the end of the year part of the date mask (check image below to better understand the issue).

I was able to work around this issue by having the On Change action bound to a hidden button and click on that button through JS although not the most pleasant solution. I'm not sure if this is an use case not covered by the code of the component so I thought I could share this feedback with you.

Hi Filipe,

Recently I also had this problem for currency mask. My solution was to make the input KeepMask = True and use this on AdvanceOptions {autoUnmask:true}. So to fix your problem you would need to change the MaskDate and include a input KeepMask and on the js wrap the below code with a if like this "if (keepMask == "False") {"

SyntaxEditor Code Snippet

    var Base_OsPage_ClientValidate = OsPage_ClientValidate;
    OsPage_ClientValidate = (function (srcElement, cleanOnlySrcElementErrors) {
        $(elementID).inputmask('remove');
        var result = Base_OsPage_ClientValidate(srcElement, cleanOnlySrcElementErrors);
        $(elementID).inputmask(dateFormat, maskOpts);
        return result;
    });

    osAjaxBackend.BindBeforeSubmit(function () {
        $(elementID).inputmask('remove');
    });
    osAjaxBackend.BindAfterSubmit(function () {
        $(elementID).inputmask('remove');
        $(elementID).inputmask(dateFormat, maskOpts);
    });

Hope this helps,

Regards,

Marcelo

Beware of these undocumented calls to osAjaxBackend. They may break without notice.

Hi João,

That JS is already on the component.  I'm just saying you don't need to run all that code if you use on AdvanceOptions {autoUnmask:true}

Regards,

Marcelo