[SOLUCIONADO] Validación de moneda (€) y entero

daniel7754 · #1 (**permalink**) 02/08/2014, 06:08

Buenas tardes a todos.

Estoy haciendo un proyecto web y necesito hacer un par de validaciones en JavaScript. Destacar que más allá de ocultar y mostrar campos, y luego la parte de sintaxis usual, que se parece mucho a cualquier otro lenguaje de programación como C, PHP o Java, no sé nada.

Necesito hacer una función a la que debo pasarle un campo y validarlo. Lo necesito para validar que una renta se pueda introducir de alguna de las siguientes maneras:
1.234,XX
1234,XX
1,234.XX
1234.XX

Pudiendo ser la X 0, 1 o 2 cifras y alargarse más hacia la izquierda. En caso de que sean cero cifras, la coma o el punto que le precedería se eliminaría. Necesito verificar que se introduce de alguna de esas maneras y si lo escribe mal, avisarle para que lo escriba bien y que el formulario no se envíe hasta que se cumpla. El mensaje puedo mostrarlo cuando pierda el foco o mientras tecleo, qué me aconsejan (respecto a que sea más válido para los navegadores).

Requiero hacer lo mismo con un entero. En este caso solo podría tener números.

Aconséjenme, porque ando un pelín perdido y es lo único que me falta para poder subir el proyecto. Tengo entendido que hay frameworks que me pueden ayudar, pero no dispongo de mucho tiempo para ponerme a aprender a usar un framework salvo que sea muy fácil su uso.

maycolalvarez · #2 (**permalink**) 02/08/2014, 07:13

no necesitas un framework, puedes conseguir funciones prefabricadas (o hacerlas) con expresiones regulares, de las cuales ya están casi todos los casos resueltos, incluso hay plugins completos con enmascarado (mask), solo tienes que buscar y lo encontrarás.

https://www.google.com/search?q=java...ency+validator

daniel7754 · #3 (**permalink**) 05/08/2014, 04:03

Buenas. Estoy trasteando con expresiones regulares. Este código lo estoy utilizando para validar una nota:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
 
function verificarMedia(objeto){
    if (!/^((10)|([0-9]([.\,][0-9]+)?))$/.test(objeto.value)){
        alert("La nota media introducida en uno de los campos es incorrecta. Introduzca una nota media entre 0 y 10. Ejemplo: 8,35");
        return false;
    }
    return true;
}
function validar(){
    window.alert ("Hola");
    return verificarMedia(document.getElementById('label'));
}
</script>
</head>
 
<body>
<form id="form1" name="form1" method="post" onsubmit="return validar();">
  <label for="label">laber</label>
  <input type="text" name="label" id="label" onchange="verificarMedia(this);"/>
</form>
<input name="" type="submit" />
</body>
</html>

Funciona bien al cambiar el valor, pero si envío el formulario falla. ¿Por qué puede ser esto? Seguro que es un error tonto, pero llevo un rato y no lo veo xD.

Por cierto, maycolalvarez, gracias por tu respuesta

Alexis88 · #4 (**permalink**) 05/08/2014, 07:17

Creo que lo adecuado es ejecutar la función verificarMedia al momento de escribir en la caja de texto, lo cual no significa que se produzca el evento onchange. En su lugar, deberías de usar el evento onkeyup. Por otro lado, si ya validaste al momento de escribir, ¿por qué vuelves a hacerlo al momento de enviar los datos del formulario, creo que con la anterior validación debería de ser suficiente.

Sería bueno ver la 'falla' que mencionas, quizá en consola se muestre algún mensaje.

Saludos

daniel7754 · #5 (**permalink**) 06/08/2014, 00:29

Buenas. a ver, con lo de los eventos ando un pelín perdido. Pero entiendo que onkeyUp será cada vez que pulse una tecla y se levante. Lo que quiero es que le avise una vez el campo cambie de valor y haya perdido el foco. Por otra parte, hago la validación al mandar el formulario también porque podría haber campos que no hubieran cambiado su valor (y por tanto estén vacíos) y se hubieran saltado la validación.

Alexis88 · #6 (**permalink**) 06/08/2014, 11:19

Creo que te había faltado explicar eso, ahora tiene más sentido.

Ahora bien, si desde la función validar vas a invocar a la función que realiza la validación, ¿por qué no mejor usas esa directamente? Creo que sería lo más conveniente pues no veo que hagas algo extra en validar.

Saludos

daniel7754 · #7 (**permalink**) 06/08/2014, 17:01

Perdón, ese es otro detalle que había obviado sin querer. Luego en el formulario, a parte de que los valores sean correctos tienen que tener unas restricciones adicionales entre ellos (que un campo no sea mayor que otro y esas cosas) y tengo que adaptar los campos para que PHP me los admita (en España se utiliza la coma para separar decimales y tal, pero PHP utiliza el punto, haría el cambio previo a mandar el formulario).

He estado trasteando esta tarde otro rato y he notado algo curioso y es que si pincho en el botón no me hace caso, pero sí lo hace si le doy al intro. ¿Hay algo que esté haciendo mal?

daniel7754 · #8 (**permalink**) 02/01/2016, 02:35

Aunque es muy tarde, me respondo a mí mismo ya que he entrado para otra consulta y me encontré que se me olvidó responder a esto. Finalmente arreglé el problema, simplemente era una cuestión de sintaxis. Hice la validación utilizando una función para ese caso (similar a como se muestra arriba) dentro de la función validar y la validación la hice al enviar directamente en vez de esperar eventos de teclado o de pérdida de foco. Respecto a los decimales, directamente dejé la coma en caso de que el usuario la pusiera y lo cambié del lado del servidor detectando esa circunstancia con una expresión regular.