cómo dejo un "/" fijo n un input para fecha?

arielcasanova · #1 (**permalink**) 28/05/2010, 06:36

Quisiera poder tener un input con los espacios para día, mes, año, separado por una barra "/" y que quede fija al momento de ingresar los valores.... no sé si me explico....

Código:

<input name="textfield2" type="text" id="textfield2" value="  /  /    " size="10" maxlength="10">

sería así, pero que cuando el usuario escribe no reemplace las / sino que los números se ubiquen solos en su lugar....

¿se puede?

gracias!

Adler · #2 (**permalink**) 28/05/2010, 07:57

Hola

Eso que pretendes hacer se llaman mascaras. Esta que te dejo, no es exactamente lo que pretendes, pero se acerca

Código Javascript:

Ver original<html>
</head>
<script type="text/javascript">
var patron = new Array(4,2,2)
function Validar(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 ) {
                    valor = valor3[0];
                } else if (valor3[2] > 31) {
                    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="Validar(this,'-',patron,true)" maxlength="10" />
</form>
</body>
</html>

Suerte

arielcasanova · #3 (**permalink**) 28/05/2010, 12:46

Gracias Adler!
Lo acabo de probar y es más o menos lo que necesito, pero no tengo idea de javascript, así que no sé si podré modificarlo exitosamente.
pruebo, y luego te cuento.

arielcasanova · #4 (**permalink**) 28/05/2010, 12:52

no hay caso... cambié todos los valor3 por valor y todos los valor por valor3, pensando que correspondían a año y día respectivamente y quedaba mes en el medio, pero no funciona...
si es realmente fácil darme una indicación, lo agradezco... si no, sigo leyendo sobre javascript.

saludos!