Expresiones regulares

pcmiguel69 · #1 (**permalink**) 02/11/2012, 05:52

Hola a Todos.

Es la primera vez que participo en este foro. Pero he estado investigando mucho y tengo varios días atorado en esto, les agradeceré su ayuda
Resulta que estoy haciendo un formulario dinámico y ya funciona puedo agregar inputs según las necesidades, pero al momento de usar el parámetro pattern para validar no funciona. lo que he visto es que la expresion regular que usa no la reconoce ¿alguien podría revisar el código y ver que estoy haciendo mal?. si lo paso en php y en html funciona de maravillas

Saludos

nuevaCelda.innerHTML="<td><input type='text' name='fecha["+posicionCampo+"]' pattern='(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20)\d\d' placeholder='dd/mm/aaaa' required=required></td>";

chwc · #2 (**permalink**) 02/11/2012, 12:59

mira, mucho sobre pattern no conozco, lo que si que existe el <input type='date' /> que te puede solucionar el problema maravillosamente . Un saludo

IsaBelM · #3 (**permalink**) 02/11/2012, 16:58

la manera mas adecuada de modificar el dom para añadir nuevos elementos es el método createElement()

una vez dicho esto, vamos al asusto que ocupa
para poder validar el formato de la fecha necesitas

un evento
un método asociado a expresiones regulares

pero es su lugar puedes usar una mascara de entrada que valide que tanto el formato como la fecha son validas

Cita:

<!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>Documento sin título</title>
<script type="text/javascript">
var patron = new Array(4,2,2)
function fnc(elem,separador,pat,numerico) {
if(elem.valoranterior != elem.value) {
valor = elem.value;
largo = valor.length;
valor = valor.split(separador);
valor2 = "";

for(i=0; i<valor.length; i++) {
valor2 += valor[i];
}

if(numerico){
for(j=0; j<valor2.length; j++){
if(isNaN(valor2.charAt(j))){
letra = new RegExp(valor2.charAt(j),"g");
valor2 = valor2.replace(letra,"");
}
}
}

valor = "";
valor3 = new Array();
for(n=0; n<pat.length; n++) {
valor3[n] = valor2.substring(0,pat[n]);
valor2 = valor2.substr(pat[n]);
}

for(q=0; q<valor3.length; q++) {
if(q == 0) {
valor = valor3[q];
}else{
if(valor3[q] != "") {

if (valor3[1] > 12) { // error. un año no tiene tantos meses
valor = valor3[0];
} else if (valor3[2] > 31) { // error. un mes no tiene tantos días
valor = valor3[0] + separador + valor3[1];
} else if ((valor3[1] == 04 || valor3[1] == 06 || valor3[1] == 09 || valor3[1] == 11) && valor3[2] >= 31) { // error. el mes no tiene tantos días
valor = valor3[0] + separador + valor3[1];
} else if (valor3[1] == 02 && valor3[2] >= 30) { // error. el mes no tiene tantos días
valor = valor3[0] + separador + valor3[1];
} else if (valor3[1] == 02 && valor3[2] >= 29 && valor3[0] % 4 != 0) { // error. no es un año bisiesto
valor = valor3[0] + separador + valor3[1];
}else{
valor += separador + valor3[q];
}

}
}
}

elem.value = valor;
elem.valoranterior = valor;
}
}
</script>
</head>
<body>
<form>
<h1>Valida una fecha yyyy-mm-dd</h1>
<input type="text" name="fecha" id= "fecha" onkeyup="fnc(this,'-',patron,true)" maxlength="10" />
</form>
</body>
</html>

pcmiguel69 · #4 (**permalink**) 04/11/2012, 03:50

Hola:

les agradezco las respuestas, pero utilizar <input type='date' /> funciona bien pero sólo en opera, lo cual implica que los usuarios lo utilicen pero no creo que lo tenga. por otro lado probé el código pero no funciona cuando lo pasó a la parte para hacer dinámico el formulario. al decir dinámico me refiero a que ponga inputs segun el usuario tenga que introducir información.

Creo que tiene que ver como funciona innerHTML si alguien sabe como interpretar esta función se lo agradeceré

furoya · #5 (**permalink**) 04/11/2012, 07:16

Excelente ese validador, IsaBelM.

Y funciona perfectamente, pcmiguel69. Agregá un

Código:

<input type="text" name="fecha2" id= "fecha2" onkeyup="fnc(this,'-',patron,true)" maxlength="10" />

al lado del otro y lo probás.

Si algo no te anda es porque lo estás haciendo mal. Asegurate de que tu programa agregue los input correctamente. No te vamos a ayudar con eso porque no somos adivinos y no hay forma de saber cómo lo estás haciendo si no dejaste nada de código útil.
Mirá cómo puso el ejemplo IsaBelM, y lo hacés igual, pero entre etiquetas [code] .

IsaBelM · #6 (**permalink**) 04/11/2012, 09:13

en realidad la mascara no es mía, es de tunait. la validación, como ya he posteado en algún otro tema, sí