0

I have a form in a visualforce page where it contains an input number field. In the IE 11 browser users are able to enter invalid characters such as letters and commas. I have tested in Chrome, Firefox, and Opera with these browsers respecting the input number validation.

Image of a user in IE 11 being able to enter a comma and the text "gal" into the input number field:

enter image description here

The issue is that the data is saved to the database in this format with the invalid characters.

Is there a way to provide support for IE 11 to recognize the input as type="number"?

<div class>
    <input type="number" min="0" onkeydown="return event.keyCode !== 69" class="form-control questTxt" value="">
</div>
0

You can use this function : numericValidation(); for onkeydown event

  • elem : pass the whole element
  • wholeLen : number of allowed whole
  • numbers dcmlLen : number of allowed decimal numbers

This function will block out all text characters and will only allow number inputs.

For example, if you would like to only allow numbers with 2 whole numbers and 3 decimal points, your tag would look like this :

<div class>
    <input type="number" min="0" onkeydown="numericValidation(this, 2, 3);" class="form-control questTxt" value="">
</div>

Add below 2 functions into the script section and you should be good to go

function numericValidation(elem, wholeLen, dcmlLen) {
    if(isNaN(elem.value))
        elem.value = elem.value.slice(0, elem.value.length-1);
    else if(!isNaN(elem.value)) {
        validateDecimal(elem, wholeLen, dcmlLen);
    }
}

function validateDecimal(elem, wholeLen, dcmlLen) {
    if(elem.value.includes(".")) {
        var whole = elem.value.split(".")[0];
        var dcml = elem.value.split(".")[1];

        if(whole.length>wholeLen)
            whole = whole.slice(0, wholeLen);

        if(dcml.length>dcmlLen)
            dcml = dcml.slice(0, dcmlLen);

        elem.value = whole+"."+dcml;
    }
    else {
        elem.value = elem.value.slice(0, wholeLen);
    }
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.