javascript - example - jQuery datepicker para evitar fechas pasadas

jquery datetimepicker example

Question

¿Cómo desactivo las fechas pasadas en jQuery datepicker? Busqué opciones pero no encuentro nada que indique la capacidad de desactivar fechas pasadas.

ACTUALIZACIÓN: Gracias a todos por la respuesta rápida. Lo intenté sin suerte. Los días aún no estaban atenuados como esperaba y todavía aceptan la fecha pasada seleccionada.

Intenté esto:

$(''#datepicker'').datepicker({ minDate: ''0'' });

No funciona

Intenté esto:

$(''#datepicker'').datepicker({ minDate: new Date() });

Todavía no funciona tampoco.

Muestra el widget de calendario muy bien. Simplemente no se atenuará o impedirá la entrada de días pasados. He intentado minDate y maxDate en el pasado sin suerte, así que pensé que no debían ser ellos.

Answer 1

// deshabilita las fechas futuras

$(''#datetimepicker1'').datetimepicker({
            format: ''DD-MM-YYYY'',
            maxDate: new Date
        }); 

// desactivar las fechas pasadas

 $(''#datetimepicker2'').datetimepicker({
        format: ''DD-MM-YYYY'',
        minDate: new Date
    });

Answer 2

Asegúrese de poner varias propiedades en la misma línea (ya que solo mostró 1 línea de código, es posible que haya tenido el mismo problema que yo).

El mío establecería la fecha predeterminada, pero no oscureció las fechas antiguas. Esto no funciona:

$(''#date_end'').datepicker({ defaultDate: +31 })
$(''#date_end'').datepicker({ minDate: 1 })

Esto hace ambas cosas:

$(''#date_end'').datepicker({ defaultDate: +31, minDate: 1 })

1 y +1 funcionan igual (o 0 y +0 en su caso).

Yo: Windows 7 x64, Rails 3.2.3, Ruby 1.9.3

Answer 3

Da cero para minitar y deshabilitará las fechas pasadas.

$( "#datepicker" ).datepicker({ minDate: 0});

Ejemplo en vivo

leer más aquí

Answer 4

Elimine las comillas que rodean 0 y funcionará.

Fragmento de código de trabajo:

// set minDate to 0 for today''s date
$(''#datepicker'').datepicker({ minDate: 0 });

body {
    font-size: 12px; /* just so that it doesn''t default to 16px (which is kinda huge) */
}

<!-- load jQuery and jQuery UI -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

<!-- load jQuery UI CSS theme -->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">

<!-- the datepicker input -->
<input type=''text'' id=''datepicker'' placeholder=''Select date'' />

Answer 5

Esto funciona:

$("#datepicker").datepicker({ minDate: +0 });

Answer 6

Estoy usando el siguiente código para dar formato a la fecha y mostrar 2 meses en el calendario ...

<script>
$(function() {

    var dates = $( "#from, #to" ).datepicker({

        showOn: "button",
        buttonImage: "imgs/calendar-month.png",
        buttonImageOnly: true,                           
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 2,

        onSelect: function( selectedDate ) {




            $( ".selector" ).datepicker({ defaultDate: +7 });
            var option = this.id == "from" ? "minDate" : "maxDate",


                instance = $( this ).data( "datepicker" ),
                date = $.datepicker.parseDate(
                    instance.settings.dateFormat ||
                    $.datepicker._defaults.dateFormat,
                    selectedDate, instance.settings );

            dates.not( this ).datepicker( "option", "dateFormat", ''yy-mm-dd'' );


        }
    });
});

</script>

El problema es que no estoy seguro de cómo restringir la selección de fechas anteriores.

Answer 7

Intente configurar startDate a la fecha actual. Por ejemplo:

$(''.date-pick'').datePicker({startDate:''01/01/1996''});

Answer 8

Prueba esto:

$("#datepicker").datepicker({ minDate: 0 });

Elimina las comillas de 0 .

Answer 9

Si se trata de un selector de fecha previamente encuadernado, configure

$("#datepicker").datepicker({ minDate: 0 });

no trabajará. Esa sintaxis es aplicable solo cuando está creando el widget.

Para establecer la fecha mínima para un selector de fechas enlazadas, use lo siguiente:

$("#datePicker").datepicker("option", "minDate", 0);

Answer 10

Solo necesita especificar una fecha mínima: establecerla en 0 significa que la fecha mínima es 0 días a partir de hoy, es decir, hoy. En su lugar, podría pasar la cadena ''0d'' (la unidad predeterminada son los días).

$(function () {
    $(''#date'').datepicker({ minDate: 0 });
});

Answer 11

Use la opción minDate para establecer la fecha posible mínima. http://jqueryui.com/demos/datepicker/#option-minDate

Answer 12

$("#datePicker").datePicker({startDate: new Date() }); . Esto funciona para mí

Answer 13

min="'' + (new Date()).toISOString().substring(0,10) + ''" el atributo min: min="'' + (new Date()).toISOString().substring(0,10) + ''"

Aquí está mi código y funcionó.

<input type="date" min="'' + (new Date()).toISOString().substring(0,10) + ''" id="'' + invdateId + ''" value="'' + d.Invoice.Invoice_Date__c + ''"/>

Answer 14

var givenStartDate = $(''#startDate'').val();
        alert(''START DATE''+givenStartDate);
        var givenEndDate = $(''#endDate'').val();
        alert(''END DATE''+givenEndDate);
        var date = new Date();
        var month = date.getMonth()+1;
        var day = date.getDate();
        var currentDate = date.getFullYear() + ''-'' +
            (month<10 ? ''0'' : '''') + month + ''-'' +
            (day<10 ? ''0'' : '''') + day;
        if(givenStartDate < currentDate || givenEndDate < currentDate)
         { 
        $("#updateButton").attr("disabled","disabled"); 
         }
         if(givenStartDate < currentDate && givenEndDate > currentDate)
            {
            $("#updateButton").attr("enabled","enabled");
            }
         if(givenStartDate > currentDate || givenEndDate > currentDate) { 
        $("#updateButton").attr("enabled","enabled"); 
         }

Prueba esto. Si hay algún error, por favor corríjanme :) Gracias a todos.