RobinHerbots / Inputmask

Input Mask plugin
https://robinherbots.github.io/Inputmask/
MIT License
6.39k stars 2.17k forks source link

Decimal mask allows entering invalid values #2561

Open eduardo-mior opened 2 years ago

eduardo-mior commented 2 years ago

Sorry for my English. I am Brazilian. I am creating a number input. I am using alias "decimal", and suffix "%" and jitMasking "true".

$("#percentInput").inputmask({
    alias: "decimal",
    suffix: "%",
    jitMasking: true
});

$("#numberInput").inputmask({
    alias: "decimal",
    jitMasking: true
});

I don't know if this is expected behavior. Not sure if this is a bug or not.

If I just type % and click outside the input it keeps only % in the input.

If I type . and then 5 and clicking outside the input will keep the value .5

Both % values and .5 values are not valid numbers.

Examples: image

image

As I said earlier I don't know if this is a bug or not. These numbers are not valid from my point of view and should not be accepted.

eduardo-mior commented 2 years ago

Any news? I just want to know if this is a problem or if this is expected behavior?

RobinHerbots commented 2 years ago

@eduardo-mior ,

I think it is clear that this is not expected. Hmm it is probably caused by the jitMasking option. .5 should translate to 0.5 to be correct and the % should be 0 %

I will look at it, when time allows.

eduardo-mior commented 2 years ago

Thank you so much for your attention @RobinHerbots I will be waiting for the correction.

At the moment I've done this hack to prevent these invalid values:

function preventInvalidNumberValue(event) {
    var value = String(event.target.value);
    if (
        ((event.key == "." || event.key == "," || event.key == "%") && (value === "" || value === undefined || value === null)) ||
        (value == "." || value == "," || value == "%" || value == ",%" || value == ".%")
    ) {
        event.target.value = "";
        event.preventDefault();
        event.stopPropagation();
        return false;
    }
}
$("#percentInput").on("input keydown", preventInvalidNumberValue);
$("#numberInput").on("input keydown", preventInvalidNumberValue);