Foros del Web » Creando para Internet » HTML »

Mascara de fecha en campo input

Estas en el tema de Mascara de fecha en campo input en el foro de HTML en Foros del Web. Buenas a todos, mi pregunta es que necesito insertar una fecha en base de datos y me gustaria poner una mascara en un campo <input ...
  #1 (permalink)  
Antiguo 19/06/2007, 16:16
 
Fecha de Ingreso: diciembre-2006
Mensajes: 50
Antigüedad: 11 años
Puntos: 1
Mascara de fecha en campo input

Buenas a todos, mi pregunta es que necesito insertar una fecha en base de datos y me gustaria poner una mascara en un campo <input type="text">,
con el formato dd/mm/aaaa, no se si se puede en html o javascriot o php.

Gracias
  #2 (permalink)  
Antiguo 19/06/2007, 16:20
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.462
Antigüedad: 15 años, 4 meses
Puntos: 2098
Re: Mascara de fecha en campo input

¿Qué es, o a qué te refieres con máscara?
  #3 (permalink)  
Antiguo 19/06/2007, 20:11
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Re: Mascara de fecha en campo input

Si te referís a lo que creo (máscara = un patrón que deben seguir los datos ingresados en el campo), tendrás que usar otra cosa además de HTML, ya que HTML no permite especificar esos detalles.

Podés hacerlo con Javascript, pero también deberías hacerlo del lado del servidor, con php o algún otro. Javascript es falible.

Ahora, bastaría con que le aplicaras una expresión regular, que en este caso podría ser:

[0-9]{2}/[0-9]{2}/[0-9]{4}

No comprueba que la fecha sea válida, pero sí que tenga la forma correcta.
Si vas a usar php, podés mirar www.php.net/ereg


Saludos.
  #4 (permalink)  
Antiguo 20/06/2007, 08:17
 
Fecha de Ingreso: diciembre-2006
Mensajes: 50
Antigüedad: 11 años
Puntos: 1
Re: Mascara de fecha en campo input

a ver, soy novato en esto del php y javascript, el codigo que me as dicho alvlin : "[0-9]{2}/[0-9]{2}/[0-9]{4}" no se donde ponerlo, si haces el favor de especificar mas te lo agradeceria, no me interesa tanto validar la fecha como que se inserte correctamente, ese codigo que as puesto es para javascript?.

Muchas gracias
  #5 (permalink)  
Antiguo 20/06/2007, 09:13
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Re: Mascara de fecha en campo input

Ese código es una expresión regular.
Sirve para comprobar que la cadena de caracteres que se ingresa en el campo cumple determinada forma, en este caso que tenga 2 números, una barra, 2 números, otra barra y finalmente 4 números.

Como ejemplo, buscando en internet encontré que para usarlo en Javascript en una función que valide un campo de texto, suponiendo que el campo tenga el id "campo":

var campo = document.getElementById("campo");
var patron = /[0-9]{2}/[0-9]{2}/[0-9]{4}/;
var coincid = reg.exec(campo.value);

if (!coincid)
// hay un error
else
// todo correcto


En PHP es diferente, te recomiendo ver la página cuyo enlace puse antes.


Saludos.
  #6 (permalink)  
Antiguo 20/06/2007, 09:19
 
Fecha de Ingreso: diciembre-2006
Mensajes: 50
Antigüedad: 11 años
Puntos: 1
Re: Mascara de fecha en campo input

Muchas gracias alvlin, intentando construir una funcion y buscando por internet e encontrado una funcion javascript que valida y evita que escribas la fecha mal, esta muy bien. la pongo aqui por si a alguien le puede ser util.

Código:
<HTML>
<body>
<FORM>
<input name="fecha" type="text" size="10" maxlength="10" onKeyUp = "this.value=formateafecha(this.value);"> 
</FORM>
<SCRIPT>
function IsNumeric(valor) 
{ 
var log=valor.length; var sw="S"; 
for (x=0; x<log; x++) 
{ v1=valor.substr(x,1); 
v2 = parseInt(v1); 
//Compruebo si es un valor numérico 
if (isNaN(v2)) { sw= "N";} 
} 
if (sw=="S") {return true;} else {return false; } 
} 
var primerslap=false; 
var segundoslap=false; 
function formateafecha(fecha) 
{ 
var long = fecha.length; 
var dia; 
var mes; 
var ano; 
if ((long>=2) && (primerslap==false)) { dia=fecha.substr(0,2); 
if ((IsNumeric(dia)==true) && (dia<=31) && (dia!="00")) { fecha=fecha.substr(0,2)+"/"+fecha.substr(3,7); primerslap=true; } 
else { fecha=""; primerslap=false;} 
} 
else 
{ dia=fecha.substr(0,1); 
if (IsNumeric(dia)==false) 
{fecha="";} 
if ((long<=2) && (primerslap=true)) {fecha=fecha.substr(0,1); primerslap=false; } 
} 
if ((long>=5) && (segundoslap==false)) 
{ mes=fecha.substr(3,2); 
if ((IsNumeric(mes)==true) &&(mes<=12) && (mes!="00")) { fecha=fecha.substr(0,5)+"/"+fecha.substr(6,4); segundoslap=true; } 
else { fecha=fecha.substr(0,3);; segundoslap=false;} 
} 
else { if ((long<=5) && (segundoslap=true)) { fecha=fecha.substr(0,4); segundoslap=false; } } 
if (long>=7) 
{ ano=fecha.substr(6,4); 
if (IsNumeric(ano)==false) { fecha=fecha.substr(0,6); } 
else { if (long==10){ if ((ano==0) || (ano<1900) || (ano>2100)) { fecha=fecha.substr(0,6); } } } 
} 
if (long>=10) 
{ 
fecha=fecha.substr(0,10); 
dia=fecha.substr(0,2); 
mes=fecha.substr(3,2); 
ano=fecha.substr(6,4); 
// Año no viciesto y es febrero y el dia es mayor a 28 
if ( (ano%4 != 0) && (mes ==02) && (dia > 28) ) { fecha=fecha.substr(0,2)+"/"; } 
} 
return (fecha); 
}
</SCRIPT>
</body>
</html>
Muchas gracias!!!
  #7 (permalink)  
Antiguo 15/05/2008, 02:28
 
Fecha de Ingreso: mayo-2008
Mensajes: 69
Antigüedad: 9 años, 7 meses
Puntos: 0
Re: Mascara de fecha en campo input

y en php, como podria poner una fecha utilizando este formato (AAAA-MM-DD) para una BDD?
  #8 (permalink)  
Antiguo 15/05/2008, 12:13
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Re: Mascara de fecha en campo input

Hola strok,
Para hacer nuevas consultas, es mejor abrir nuevos temas.

Para tu caso, podés usar la función date().
Si querés formatear la hora actual, simplemente usás
Código PHP:
date('Y-m-d'); 
Si tenés una marca de tiempo, la pasás como segundo parámetro
Código PHP:
date('Y-m-d'$tiempo); 
Y si tenés una fecha en día, mes y año, podés usar mktime() como segundo parámetro.

Revisá las páginas de cada función para tener más detalles.


Saludos.
  #9 (permalink)  
Antiguo 22/06/2008, 13:59
Avatar de el cirujano  
Fecha de Ingreso: mayo-2003
Ubicación: Frente al PC
Mensajes: 609
Antigüedad: 14 años, 6 meses
Puntos: 3
Respuesta: Mascara de fecha en campo input

Gracias alhernandez7, por tu función, aunque la consegui 1 año y 2 dias despues que la necesitaba pero gracias por tu aporte
__________________
CSS2 + AJAX + PHP + MySQL, una mezcla sin competencia!!!!!!
  #10 (permalink)  
Antiguo 22/04/2009, 12:33
 
Fecha de Ingreso: enero-2004
Ubicación: Medellin
Mensajes: 171
Antigüedad: 13 años, 11 meses
Puntos: 8
Respuesta: Mascara de fecha en campo input

misma funcion pero para que valide formato yyyy/mm/dd
Código:
//valida formato yyyy/mm/dd
function IsNumeric(valor)
{
	var log=valor.length;
	var sw="S";
	for (x=0; x<log; x++)
	{
	   v1=valor.substr(x,1);
	   v2 = parseInt(v1);
		//Compruebo si es un valor numérico
		if (isNaN(v2))
		{
		sw= "N";
		}
	}
	
	if (sw=="S")
	{return true;}
	else
	{return false;}
	}

	var primerslap=false;
	var segundoslap=false;
function formateafecha(fecha)
{
	var long = fecha.length;
	var dia;
	var mes;
	var ano;

	   ano=fecha.substr(0,4);
	   if ((long>=4) && (primerslap==false))
	   {
		   
		   ano=fecha.substr(0,4);
		   //alert("akii" + ano);
		   if ((IsNumeric(ano)== false) || ((ano==0) || (ano<1900) || (ano>2100)))
		   {
		       fecha=""; primerslap=false;
		   }
		   else
		   {
		      fecha=fecha.substr(0,4)+"/"+fecha.substr(5,9); primerslap=true;
		   }
	    }
		else
		{
		    ano=fecha.substr(0,4);
		    if (IsNumeric(ano)==false)
		    {
		        fecha="";
		     }
		     if ((long<=4) && (primerslap=true))
		     {
		        fecha=fecha.substr(0,4); primerslap=false;
		     }
	   }// fin if ((long>=4) && (primerslap==false))
	    
	   
	   if ((long>=7) && (segundoslap==false))
	   {
		   mes=fecha.substr(5,2);
		   if ((IsNumeric(mes)==true) &&(mes<=12) && (mes!="00"))
		   {
		       fecha=fecha.substr(0,7)+"/"+fecha.substr(8,2); segundoslap=true;
		   }
		   else
		   {
		      fecha=fecha.substr(0,5);; segundoslap=false;
		   }
	    }
	   else
		{
		     if ((long<=7) && (segundoslap=true))
		    {
		       fecha=fecha.substr(0,6); segundoslap=false;
		    }
	   }//if ((long>=7) && (segundoslap==false))
	   
	   
	   if (long>=9)
       {
           dia=fecha.substr(8,5);
           if (IsNumeric(dia)==false)
           {
               fecha=fecha.substr(0,8);
           }
           else
           {
               if (long==10)
               {
				   if ((dia >31) || (dia=="00"))
                  {
                      fecha=fecha.substr(0,8);
                   }
                }
           }
     } //if (long>=7) 
	 
	 
	 if (long>=10)
     {
         fecha=fecha.substr(0,10);
         dia=fecha.substr(8,2);
         mes=fecha.substr(5,2);
         ano=fecha.substr(0,4);
        // Año no biciesto y es febrero y el dia es mayor a 28
		//alert(mes);
        if ( (ano%4 != 0) && (mes ==02) && (dia > 28) ) // es año biciesto
        {
		   fecha=fecha.substr(0,4)+"/";
         }
      } 
	   

    return (fecha);
}
  #11 (permalink)  
Antiguo 28/05/2012, 21:31
Avatar de TheMasterweb  
Fecha de Ingreso: septiembre-2008
Mensajes: 16
Antigüedad: 9 años, 2 meses
Puntos: 0
Respuesta: Mascara de fecha en campo input

Talvés me dirán que este es un post muy antiguo, pero recien lo veo y me sirvio mucho, asi que comparto las mejoras que le hice.

Pues en realidad fue una bobadita, pero que me hizo matar la cabeza un rato, asi que aqui lo comparto.

al final validé que los meses 4-6-9-11 solo tengan 30 dias, que febrero solo 28 y si es bisiesto entonces 29.

Código:
//valida formato yyyy/mm/dd aspirante
function IsNumeric(valor)
{
	var log=valor.length;
	var sw="S";
	for (x=0; x<log; x++)
	{
	   v1=valor.substr(x,1);
	   v2 = parseInt(v1);
		//Compruebo si es un valor numérico
		if (isNaN(v2))
		{
		sw= "N";
		}
	}
	
	if (sw=="S")
	{return true;}
	else
	{return false;}
	}

	var primerslap=false;
	var segundoslap=false;
function formateafecha(fecha)
{
	var long = fecha.length;
	var dia;
	var mes;
	var ano;

	   ano=fecha.substr(0,4);
	   if ((long>=4) && (primerslap==false))
	   {
		   
		   ano=fecha.substr(0,4);
		   //alert("akii" + ano);
		   if ((IsNumeric(ano)== false) || ((ano==0) || (ano<1993) || (ano>1998)))
		   {
		       fecha=""; primerslap=false;
		   }
		   else
		   {
		      fecha=fecha.substr(0,4)+"-"+fecha.substr(5,9); primerslap=true;
		   }
	    }
		else
		{
		    ano=fecha.substr(0,4);
		    if (IsNumeric(ano)==false)
		    {
		        fecha="";
		     }
		     if ((long<=4) && (primerslap=true))
		     {
		        fecha=fecha.substr(0,4); primerslap=false;
		     }
	   }// fin if ((long>=4) && (primerslap==false))
	    
	   
	   if ((long>=7) && (segundoslap==false))
	   {
		   mes=fecha.substr(5,2);
		   if ((IsNumeric(mes)==true) &&(mes<=12) && (mes!="00"))
		   {
		       fecha=fecha.substr(0,7)+"-"+fecha.substr(8,2); segundoslap=true;
		   }
		   else
		   {
		      fecha=fecha.substr(0,5);; segundoslap=false;
		   }
	    }
	   else
		{
		     if ((long<=7) && (segundoslap=true))
		    {
		       fecha=fecha.substr(0,6); segundoslap=false;
		    }
	   }//if ((long>=7) && (segundoslap==false))
	   
	   if (long>=9)
       {
           dia=fecha.substr(8,5);
           if (IsNumeric(dia)==false)
           {
               fecha=fecha.substr(0,8);
           }
           else
           {
               if (long==10)
               {
				   if ((dia >31) || (dia=="00"))
                  {
                      fecha=fecha.substr(0,8);
                   }
				  
                }
           }
     } //if (long>=7) 
	 	 
	 if (long>=10)
     {
         fecha=fecha.substr(0,10);
         dia=fecha.substr(8,2);
         mes=fecha.substr(5,2);
         ano=fecha.substr(0,4);
        // Año no biciesto y es febrero y el dia es mayor a 28
		//alert(mes);
        if ( (ano%4 != 0) && (mes ==02) && (dia > 28) )
        {
                  // desde aqui las correcciones
		   fecha=fecha.substr(0,8);
         }
		 else
		 if ((ano%4 == 0) && (mes=="02") && (dia>29))
		   {
		      fecha=fecha.substr(0,8); 
		   }
		    else
		 if ((mes=="04") || (mes=="06") || (mes=="09") || (mes=="11") && (dia>30))
		   {
		      fecha=fecha.substr(0,8); 
		   }
      }

    return (fecha);
}
Para los que validan dd-mm-aaaa pues solocopien la parte donde comente " // desde aqui las correcciones" y listo.

Espero les sea de utilidad como a mi...
  #12 (permalink)  
Antiguo 31/08/2012, 00:12
 
Fecha de Ingreso: agosto-2012
Ubicación: Cúcuta - Norte de Santander
Mensajes: 12
Antigüedad: 5 años, 3 meses
Puntos: 1
De acuerdo Respuesta: Mascara de fecha en campo input

Primero que Todo buenas días, de antemano gracias porque las funciones que mostraron inicialmente eran lo que buscaba y el arreglo que le hicieron mejor aún, siempre es bueno saber que personas con conocimientos más avanzados en temas de programación están dispuestos a ayudarnos.
Por otro lado comento que estoy en el diseño de un proyecto de un aplicativo para el manejo de ventas multinivel, al cual me sirve arto éstas funciones que copié, espero que me sigan ayudando y que de igual manera yo les pueda servir en cualequier momento.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 11:26.