validate number in input and at the same time format it in thousands

Question

validate number in input and at the same time format it in thousands

Navigation

#1 by (-1 votes)

2

Good day, I have the following code that formats several input that have the input_values_provisional class, placing point every three characters in this way:

500.000.000

The code itself works perfect on its own since I've checked it out.

$(document).ready(
  function()
  {
    $(".input_valores_provisionales").on({
      "focus": function(event) {
        $(event.target).select();
      },
      "keyup": function(event) {
        $(event.target).val(function(index, value) {
          return value.replace(/\D/g, "")
          .replace(/([0-9])([0-9]{3})$/, '$1.$2')
          .replace(/\B(?=(\d{3})+(?!\d)\.?)/g, ".");
        });
      }
    });
  }
);

On the other hand, I must validate that only numerical values are written in the mentioned inputs, I do it this way:

$('.input_valores_provisionales').keyup(
    function()
    {
      var total = 0;
      //recorremos los input para que haga la suma
      $(".input_valores_provisionales").each(
        function()
        {
          //compruebo que lo digitado sea un numero
          if (!isNaN($(this).val()))
          {
            //convierto a entero la cadena del input en base 10
            var numero_entero = parseInt($(this).val(),10);
            total = total+numero_entero;
            //muestro la suma en el span
            if(isNaN(total))
            {
              $("#span_total_provisionales").text("Rellena todos los campos");
            }
            else {
              $("#span_total_provisionales").text("$"+total);
            }

          }
          else
          {
              alert("Debe ingresar un valor numerico");
              //borrar el contenido del input ya que no es numerico
              $(this).val('');
          }
        }
      );
    }
  );

This code also works perfect by itself, it validates me if I write a letter warning and deleting the input no matter the length being 5 or 5000000000

Since you see both codes separately, they work great for me, the problem is that when I put both codes to work, it works up to a certain length of the number typed, for example if I want to type 500,000,000

goes up to 5,000,000 and just by typing the next zero to go to 50,000,000 I get the alert that it is not a number, I need to allow me to write at least 9 characters ie up to 999,999,999

I've also tried doing it with points for the first three zeros on the left as pennies and then with, as in the US currency in this way

5,000,000

Any ideas?

javascript jquery formato

asked by Gabriel Uribe Gomez 06.04.2018 в 21:48

source

1 answer

Validate a variable with a field from my bd Avoid string break when the available horizontal space ends

score -1 · Answer 1

I leave you a code I hope you find useful:

<input id="number">

javascript:

$("#number").on({
  "focus": function(event) {
    $(event.target).select();
  },
  "keyup": function(event) {
    $(event.target).val(function(index, value) {
      return value.replace(/\D/g, "")
        .replace(/([0-9])([0-9]{2})$/, '$1.$2')
        .replace(/\B(?=(\d{3})+(?!\d)\.?)/g, ",");
    });
  }
});

Try it here!