Inputmask: Hide mask when input has no value

[richard-flosi]

I'm looking to hide the mask when the input has no value.

Specifically, I'm using an altered version of the currency alias and I'd like to hide the mask from the input field when it is empty. I am using a prefix: '$' so I get the $ in the input field, but I'd prefer to only have the prefix/mask show when the user enters a value.

Looking at the definition for numeric.mask it would appear I could fix this here if I knew how to determine if the input had a value or not, which I'm not seeing a way of doing. If I could determine if the value was empty, then I think I could alter what was returned by mask() to not include the prefix. Maybe that wouldn't work. I'm not sure.

numeric: {
    mask: function(opts) {
        if (0 !== opts.repeat && isNaN(opts.integerDigits) && (opts.integerDigits = opts.repeat), 
        opts.repeat = 0, opts.groupSeparator == opts.radixPoint && (opts.groupSeparator = "." == opts.radixPoint ? "," : "," == opts.radixPoint ? "." : ""), 
        " " === opts.groupSeparator && (opts.skipOptionalPartCharacter = void 0), opts.autoGroup = opts.autoGroup && "" != opts.groupSeparator, 
        opts.autoGroup && isFinite(opts.integerDigits)) {
            var seps = Math.floor(opts.integerDigits / opts.groupSize), mod = opts.integerDigits % opts.groupSize;
            opts.integerDigits += 0 == mod ? seps - 1 : seps;
        }
        opts.definitions[";"] = opts.definitions["~"];
        var mask = opts.prefix;
        return mask += "[+]", mask += "~{1," + opts.integerDigits + "}", void 0 != opts.digits && (isNaN(opts.digits) || parseInt(opts.digits) > 0) && (mask += opts.digitsOptional ? "[" + (opts.decimalProtect ? ":" : opts.radixPoint) + ";{" + opts.digits + "}]" : (opts.decimalProtect ? ":" : opts.radixPoint) + ";{" + opts.digits + "}"), 
        mask += opts.suffix;
    },

Please advise.

[RobinHerbots]

@richard-flosi ,

Try setting the clearMaskOnLostFocus option to true.

[richard-flosi]

@RobinHerbots Awesome. That worked. I think there is something similar for the Hover state case too. I'll try to track that down.

[richard-flosi]

Got it!

These 3 options made it work how I wanted:

        showMaskOnHover: false,
        showMaskOnFocus: false,
        clearMaskOnLostFocus: true,