Como puedo bloquear fechas anteriores en un input type date
-
¿puedes explicar un poco mas?, no se entiende bien que intentas lograr.– rnrneverdiesCommented el 1 ago. 2016 a las 18:05
-
en un formulario de reservas, necesito desactivar las fechas pasadas. que solo se pueda seleccionar la fecha desde hoy hacia adelante.– RaulCommented el 1 ago. 2016 a las 18:50
Añade un comentario
|
4 respuestas
Utiliza el atributo min
:
<input type="date" min="2016-01-01">
Aquí tienes algo de documentación: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
En HTML5
existe el atributo min
, desafortunadamente HTML5
no tiene ninguna forma de sacar la fecha actual para poderla poner como value
de un atributo.
Posibles soluciones:
PHP:
<input type="date" name="fecha" id="fecha" placeholder="Introduce una fecha" required min=<?php $hoy=date("Y-m-d"); echo $hoy;?> />
Javascript:
document.getElementById('#fecha').value = new Date().toDateInputValue();
Javascript con ayuda de jQuery:
$(document).ready( function() {
$('#fecha').val(new Date().toDateInputValue());
});
Si lo quieres validar del lado del servidor (PHP) utiliza lo siguiente:
$fechaEntrada = '2016-07-22';
$fechaLimite = '2016-08-01';
//si la fecha enviada del form es menor a la que deseas validar
if( strtotime($fecha_entrada) < strtotime($fecha_limite) ) {
//la fecha es menor
}else{
//la operación fue realizada en un periodo válido
}
Para validarlo en JS puedes hacer lo siguiente:
var fechaEntrada = '2016-07-22';
var fechaLimite = '2016-08-01';
if( (new Date(fechaEntrada).getTime() < new Date(fechaLimite).getTime()))
{
//alert('la fecha es menor');
//return false;
}else{
//return true;
}
Tuve la misma duda, pero utilizando java script puedes resolverlo de mandera sencilla
Primero recuerda que debes tener habilitado el atributo min en tu input
<input type="date" id="fechaReserva" min="2017-01-01" />
Luego utiliza esta funcion reemplazando obiamente los id
var fecha = new Date();
var anio = fecha.getFullYear();
var dia = fecha.getDate();
var _mes = fecha.getMonth();//viene con valores de 0 al 11
_mes = _mes + 1;//ahora lo tienes de 1 al 12
if (_mes < 10)//ahora le agregas un 0 para el formato date
{ var mes = "0" + _mes;}
else
{ var mes = _mes.toString;}
document.getElementById("fechaReserva").min = anio+'-'+mes+'-'+dia;