jQuery datepicker для запобігання минулій даті

Як вимкнути минулі дати на jQuery datepicker? Я шукав варіанти, але, здається, не знайшов нічого, що вказує на можливість відключити минулі дати.

ОНОВЛЕННЯ: Дякую всім за швидку відповідь. Я спробував це без удачі. Дні все ще не були сірими, як я очікував, і все ще приймають обрану минулу дату.

Я спробував це:

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

Не працює.

Я спробував це:

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

Досі теж не працює.

Він відмінно відображає віджет календаря. Це просто не стане сірим або запобіжить введенню минулих днів. Я намагався minDate і maxDate в минулому, не маючи удачі, тому я зрозумів, що це не повинні бути вони.

Спробуйте це:

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

Видаліть лапки з 0.

Вам просто потрібно вказати мінімальну дату - встановлення значення 0 означає, що мінімальна дата - 0 днів з сьогоднішнього дня, тобто сьогодні. '0d'Натомість ви можете передати рядок (одиницею за замовчуванням є дні).

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

Якщо ви маєте справу з раніше встановленим засобом вибору дати, тоді налаштування

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

не буде працювати. Цей синтаксис застосовний лише тоді, коли ви створюєте віджет.

Щоб встановити мінімальну дату для обмеженого вибору дати, використовуйте наступне:

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

Видаліть лапки навколо, 0і це буде працювати.

Фрагмент робочого коду:

// 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' />

За допомогою опції minDate встановіть мінімально можливу дату. http://jqueryui.com/demos/datepicker/#option-minDate

Дайте нуль мінімальній даті, і це призведе до скасування минулих дат.

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

Живий приклад

докладніше читайте тут

Це працює:

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

// вимкнути майбутні дати

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

// вимкнути минулі дати

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

$("#datePicker").datePicker({startDate: new Date() });. Це працює для мене

Я використовую наступний код для форматування дати та відображення 2 місяців у календарі ...

<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>

Проблема в тому, що я не знаю, як обмежити вибір попередніх дат.

Переконайтеся, що ви розміщуєте кілька властивостей в одному рядку (оскільки ви показали лише 1 рядок коду, можливо, у вас була та сама проблема, що і у мене).

Моя встановлювала дату за замовчуванням, але не сіріла старі дати. Це не працює:

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

Це робить обидва:

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

1 і +1 працюють однаково (або 0 і +0 у вашому випадку).

Я: Windows 7 x64, Rails 3.2.3, Ruby 1.9.3

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"); 
         }

Спробуйте це. Якщо є помилка, будь ласка, виправте мене :) Дякую всім.

Це має спрацювати <input type="text" id="datepicker">

var dateToday = new Date();
$("#datepicker").datepicker({
    minDate: dateToday,
    onSelect: function(selectedDate) {
    var option = this.id == "datepicker" ? "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);
    }
});

Спробуйте встановити startDateпоточну дату. Наприклад:

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

Я використав атрибут min: min="' + (new Date()).toISOString().substring(0,10) + '"

Ось мій код і він спрацював.

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