fechas - jquery datepicker mostrar solo mes y año

jQuery Date Picker-deshabilita las fechas pasadas

Question

Estoy tratando de seleccionar un rango de fecha usando el selector de fecha UI.

en el campo from / to las personas no deberían poder ver o seleccionar fechas anteriores al día actual.

Este es mi código:

$(function() {
    var dates = $( "#from, #to" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        onSelect: function( selectedDate ) {
            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", option, date );
        }
    });
});

¿Puede alguien decirme cómo desactivar fechas anteriores a la fecha actual?

Answer 1

Debe crear un nuevo objeto de fecha y configurarlo como minDate cuando inicialice la fecha de selección

<label for="from">From</label> <input type="text" id="from" name="from"/> <label for="to">to</label> <input type="text" id="to" name="to"/>

var dateToday = new Date();
var dates = $("#from, #to").datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 3,
    minDate: dateToday,
    onSelect: function(selectedDate) {
        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", option, date);
    }
});

Editar - a partir de su comentario ahora funciona como se esperaba http://jsfiddle.net/nicolapeluchetti/dAyzq/1/

Answer 2

Declare la variable dateToday y use la función Date () para configurarlo ... luego use esa variable para asignar a minDate que es un parámetro de datepicker.

var dateToday = new Date(); 
$(function() {
    $( "#datepicker" ).datepicker({
        numberOfMonths: 3,
        showButtonPanel: true,
        minDate: dateToday
    });
});

Eso es todo ... Por encima de la respuesta fue muy útil ... sigan así chicos ...

Answer 3

Esta es una manera fácil de hacer esto

$(''#datepicker'').datepicker(''setStartDate'', new Date());

también podemos inhabilitar días futuros

$(''#datepicker'').datepicker(''setEndDate'', new Date());

Answer 4

He creado la función para desactivar la fecha anterior, deshabilitar los días flexibles de fin de semana (como el sábado, el domingo)

Estamos utilizando el método beforeShowDay del complemento jQuery UI datepicker.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
var NotBeforeToday = function(date) {
  var now = new Date(); //this gets the current date and time
  if (date.getFullYear() == now.getFullYear() && date.getMonth() == now.getMonth() && date.getDate() >= now.getDate() && (date.getDay() > 0 && date.getDay() < 6) )
   return [true,""];
  if (date.getFullYear() >= now.getFullYear() && date.getMonth() > now.getMonth() && (date.getDay() > 0 && date.getDay() < 6))
   return [true,""];
  if (date.getFullYear() > now.getFullYear() && (date.getDay() > 0 && date.getDay() < 6))
   return [true,""];
  return [false,""];
 }


jQuery("#datepicker").datepicker({
  beforeShowDay: NotBeforeToday
    });

Aquí la fecha de hoy es el 15 de septiembre. He desactivado el sábado y el domingo.

Answer 5

Solo para agregar a esto:

Si también necesita evitar que el usuario escriba manualmente una fecha en el pasado, esta es una posible solución. Esto es lo que terminamos haciendo (basado en la respuesta de @Nicola Peluchetti)

var dateToday = new Date();

$("#myDatePickerInput").change(function () {
    var updatedDate = $(this).val();
    var instance = $(this).data("datepicker");
    var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, updatedDate, instance.settings);

    if (date < dateToday) {
        $(this).datepicker("setDate", dateToday);
    }
});

Lo que hace es cambiar el valor a la fecha actual si el usuario escribe manualmente una fecha en el pasado.

Answer 6

Use la opción "minDate" para restringir la fecha más temprana permitida. El valor "0" significa hoy (0 días a partir de hoy):

    $(document).ready(function () {
        $("#txtdate").datepicker({
            minDate: 0,
            // ...
        });
    });

Documentos aquí: http://api.jqueryui.com/datepicker/#option-minDate

Answer 7

establece el atributo startDate de datepicker, funciona, a continuación está el código de trabajo

$(function(){
$(''#datepicker'').datepicker({
    startDate: ''-0m''
    //endDate: ''+2d''
}).on(''changeDate'', function(ev){
    $(''#sDate1'').text($(''#datepicker'').data(''date''));
    $(''#datepicker'').datepicker(''hide'');
});
})

Answer 8

solo reemplace su código:

código antiguo:

$("#dateSelect").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: ''yy-mm-dd''

});

nuevo código:

$("#dateSelect").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: ''yy-mm-dd'',
    minDate: 0
});

Answer 9

tienes que declarar la fecha actual en variables como esta

 $(function() {
    var date = new Date();
    var currentMonth = date.getMonth();
    var currentDate = date.getDate();
    var currentYear = date.getFullYear();
    $(''#datepicker'').datepicker({
    minDate: new Date(currentYear, currentMonth, currentDate)
    });
})

Answer 10

http://api.jqueryui.com/datepicker/#option-minDate

La fecha mínima seleccionable. Cuando se establece en null , no hay un mínimo.

Múltiples tipos soportados:

Fecha: un objeto de fecha que contiene la fecha mínima.
Número: varios días a partir de hoy. Por ejemplo, 2 representa two days desde hoy y -1 representa yesterday .
Cadena: una cadena en el formato definido por la opción dateFormat , o una fecha relativa.
Las fechas relativas deben contener pares de valores y períodos; los períodos válidos son y por years , m por months , w por weeks d por days . Por ejemplo, +1m +7d representa one month and seven days partir de today .

Para no mostrar fechas anteriores que no sean las de hoy

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

Answer 11

Demostración en vivo , prueba esto,

    $(''#from'').datepicker(
     { 
        minDate: 0,
        beforeShow: function() {
        $(this).datepicker(''option'', ''maxDate'', $(''#to'').val());
      }
   });
  $(''#to'').datepicker(
     {
        defaultDate: "+1w",
        beforeShow: function() {
        $(this).datepicker(''option'', ''minDate'', $(''#from'').val());
        if ($(''#from'').val() === '''') $(this).datepicker(''option'', ''minDate'', 0);                             
     }
   });

Answer 12

El atributo " mindate " debe usarse para deshabilitar las fechas aprobadas en jquery datepicker.

minDate: new Date () or minDate: ''0'' es la clave para esto.

Ex:

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

O

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

Answer 13

$( "#date" ).datetimepicker({startDate:new Date()}).datetimepicker(''update'', new Date());

new Date() : función obtener la fecha actual fecha anterior están bloqueados. 100% de trabajo

Answer 14

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

minDate:0 funciona para mí.