2

Intento validar un campo numérico usando el método test. Pero al probar el código,tiene el siguiente comportamiento, pruebo varias veces el mismo número y me imprime true, si doy click para validar nuevamente imprime false y así sigue las veces que intento validar. Alguien podría decirme porque tal comportamiento?. GRacias .

     **Declaración de variables** 
    const paciente = document.querySelector("#primer-paciente"),   
              pacientes = document.querySelectorAll(".paciente"),
              addPaciente = document.querySelector('#adicionar-paciente'),
              peso = document.querySelector('#peso'),
              altura = document.querySelector('#altura'),
              gordura = document.querySelector('#gordura'),
              regExpNumber = /(^[0-9]{1,3}$|^[0-9]{1,3}\.[0-9]{1,3}$)/ig,
              regExpStringName = /^(?=.{3,18}$)[a-zñA-ZÑ](\s?[a-zñA-ZÑ])*$/ig;
             
        
        **Event**
        
        addPaciente.addEventListener('click',(e)=>{
            e.preventDefault();
            if(regExpNumber.test(peso.value)){
                console.log('Introdujo un peso correcto');
                peso.value = '';
            }else{
                console.log('Introdujo un peso erróneo');
                peso.value = '';
            }
        });
       
        //Ouput=> Introdujo un peso correcto 
        //Ouput=>Introdujo un peso erróneo
        //Ouput=>Introdujo un peso correcto
        //Ouput=>Introdujo un peso erróneo
3
  • Uno de los problemas que veo en tu código es que no capturas el valor del elemento cuando haces clic en el botón de validación. En mi opinión, deberías capturar dicho valor en el momento que haces clic, no antes y no después. Saludos el 21 jul. 2022 a las 9:53
  • Otro problema es que: multiples llamadas a test() sobre la misma instancia global de una expresión regular avanzará desde de la ocurrencia anterior. Es por ello que al ser la expresión regular la misma desde un inicio, te devuelve false en llamadas posteriores. La solución es construir la regexp de forma local en tu manejador de eventos y leer el valor del campo también de forma local. Más en la documentación el 21 jul. 2022 a las 9:59
  • Muchas gracias. Me pondré en ello . Gracias. el 21 jul. 2022 a las 13:32

1 respuesta 1

1

PROBLEMA

Tal como te comento, el problema es que estás declarando de forma global, tanto la expresión regular como el valor de cadena que vas a validar.

En la documentación del método test del Objeto RegExp, se establece lo siguiente:

...múltiples llamadas a test() sobre la misma instancia global de una expresión regular avanzará desde de la ocurrencia anterior.

Es por ello que al pasar la primera validación, el cursor se mueve hasta el final de la primera ocurrencia en la cadena que estás validando. Así, en sucesivas validaciones, al no existir nada que sea válido, devolverá false.

SOLUCIÓN

La solución es simple, debes leer de forma local la cadena que vas a evaluar y declarar la expresión regular también de forma local, es decir, dentro del manejador de evento del botón de validación debes leer el valor del elemento <input> que estás validando y declarar la constante de tu expresión regular. Por ejemplo:

const valida = document.getElementById("validar");

valida.addEventListener('click', e => {
  const regexp = /(^[0-9]{1,3}$|^[0-9]{1,3}\.[0-9]{1,3}$)/ig;
  const peso = document.getElementById('peso').value;
  const result = regexp.test(peso);
  document.getElementById('result').innerText = result;
});
.container {
  padding: 0.2rem 0.5rem
}
<div class="container">
  <input size="30" id="peso" placeholder="Introduzca un valor numérico">
  <input type="button" value="validar" id="validar">
</div>
<div class="container">
  <span id="result"></span>
</div>

Espero que esto te ayude a resolver el problema.

1
  • Muchas gracias. Fue lde mucha ayuda. el 21 jul. 2022 a las 13:37

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.