By Carmen Cisterna Chamblas


2020-06-30 00:00:15 8 Comments

I have the following code to admit decimals:

    <input id="precio" type="text" class="form-control" onclick="this.select();" onkeypress="return OnlyDecimal(event, '0.0', 4, 2);"/>

    <script>
     function OnlyDecimal(e, valInicial, nEntero, nDecimal) {
            var obj = e.srcElement || e.target;
            var key_code = (document.all) ? e.keyCode : e.which;
            var key_val = String.fromCharCode(key_code);
            var patron2 = /[\d.]/;
            var control = (key_code === 46 && (/[.]/).test(obj.value)) ? false : true;
            var existePto = (/[.]/).test(obj.value);
            //el tab
            if (key_code === 8)
                return true;

            if (valInicial !== obj.value) {
                var TControl = obj.value.length;
                if (existePto === false && key_code !== 46) {
                    if (TControl === nEntero) {
                        obj.value = obj.value + ".";
                    }
                }

                if (existePto === true) {
                    var subVal = obj.value.substring(obj.value.indexOf(".") + 1, obj.value.length);

                    if (subVal.length >= nDecimal) {
                        return false;
                    }
                }

                return patron2.test(key_val) && control;
            }
            else {
                if (valInicial === obj.value) {
                    obj.value = '';
                }
                return patron2.test(key_val) && control;
            }
        }
      </script>

enter image description here

But when it's at the maximum number of digits allowed and with focus selected, it doesn't allow me to enter numbers to replace the one in the input.

Is there a way to validate this? or how to detect when the input is selected to validate it ?. The goal is to be able to enter digits in the input when everything is selected. Is there any idea or solution? Is it explained?

1 comments

@am05mhz 2020-06-30 03:44:14

you can use selectionStart and selectionEnd like below, if that is what you want

<input id="precio" type="text" class="form-control" onclick="this.select();" onkeypress="return OnlyDecimal(event, '0.0', 4, 2);"/>

<script>
 function OnlyDecimal(e, valInicial, nEntero, nDecimal) {
        var obj = e.srcElement || e.target;
        var key_code = (document.all) ? e.keyCode : e.which;
        var key_val = String.fromCharCode(key_code);
        var patron2 = /[\d.]/;
        var control = (key_code === 46 && (/[.]/).test(obj.value)) ? false : true;
        var existePto = (/[.]/).test(obj.value);
        
        var haveSelection = obj.selectionEnd - obj.selectionStart;
        
        //el tab
        if (key_code === 8)
            return true;

        if (valInicial !== obj.value) {
            var TControl = obj.value.length;
            if (existePto === false && key_code !== 46) {
                if (TControl === nEntero) {
                    obj.value = obj.value + ".";
                }
            }

            if (existePto === true) {
                var subVal = obj.value.substring(obj.value.indexOf(".") + 1, obj.value.length);

                if (subVal.length >= nDecimal && !haveSelection) {
                    return false;
                }
            }

            return patron2.test(key_val) && control;
        }
        else {
            if (valInicial === obj.value) {
                obj.value = '';
            }
            return patron2.test(key_val) && control;
        }
    }
  </script>

Related Questions

Sponsored Content

96 Answered Questions

[SOLVED] How can I remove a specific item from an array?

  • 2011-04-23 22:17:18
  • Walker
  • 6835442 View
  • 8412 Score
  • 96 Answer
  • Tags:   javascript arrays

66 Answered Questions

[SOLVED] How do I check whether a checkbox is checked in jQuery?

80 Answered Questions

[SOLVED] How do I detect a click outside an element?

86 Answered Questions

[SOLVED] How do JavaScript closures work?

42 Answered Questions

[SOLVED] How do I remove a property from a JavaScript object?

58 Answered Questions

[SOLVED] How do I redirect to another webpage?

39 Answered Questions

[SOLVED] How do I return the response from an asynchronous call?

3 Answered Questions

45 Answered Questions

[SOLVED] Detecting an undefined object property

57 Answered Questions

[SOLVED] How do I check if an element is hidden in jQuery?

Sponsored Content