Как ограничить диапазон дат в jquery datepicker, указав две даты? - PullRequest
Новая
       7

Как ограничить диапазон дат в jquery datepicker, указав две даты?

16 голосов
/ 27 декабря 2010

У меня есть две даты, которые хранятся в БД, и я выбираю их, используя $ .ajax (), и мне нужно показать значения DatePicker между датами, которые я выбрал из БД.

Вот мой код для него. Но он не работает должным образом 

function setDatePickerSettings(isFisc) {
        var fSDate, fEDate;
        $.ajax({
            type: "POST",
            url: '../Asset/Handlers/AjaxGetData.ashx?fisc=1',
            success: function(data) {
                alert(data);
                var res = data.split("--");//data will be 4/4/2010 12:00:00--5/4/2011 12:00:00 
                var sDate = res[0].split(getSeparator(res[0]));
                alert("Separator " + getSeparator(res[1]) + " Starts " + sDate);
                var eDate = res[1].split(getSeparator(res[1]));
                alert("End " + eDate);
                alert("sub " + sDate[0]);
                fSDate = new Date(sDate[2].substring(0, 4), sDate[0], sDate[1]);
                alert("Starts " + fSDate.substring(0, 4));
                fEDate = new Date(eDate[2].substring(0, 4), eDate[0], eDate[1]);
                alert("eND " + fEDate.toString());

            }

        });
          var dtSettings = {
        changeMonth: true,
        changeYear: true,
        showOn: 'both',
        buttonImage: clientURL + 'images/calendar.png',
        buttonImageOnly: true,
        showStatus: true,
        showOtherMonths: false,
        dateFormat: 'dd/mm/yy',
        minDate:fSDate, //assigning startdate
        maxDate:fEDate //assigning enddate
    };

    return dtSettings;
}

Просьба предоставить какое-то решение. Мне нужен выбор даты и времени, который требует значений между этим диапазоном. Заранее спасибо

Ответы [ 4 ]

41 голосов
/ 27 декабря 2010

Ваш синтаксис неверен для minDate / maxDate. Вы можете прочитать документацию на веб-сайте jQuery UI, где демо-версия .Я предлагаю вам взглянуть на это, чтобы адаптировать его к вашему конкретному случаю.Это выглядит примерно так: 

$( ".selector" ).datepicker({ minDate: new Date(2007, 1 - 1, 1) });

или

. Это сделает следующее, чтобы вы ничего не могли выбрать до сегодняшнего дня. 

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

, и этосделаю так, чтобы вы ничего не могли выбрать до завтра 

$( ".selector" ).datepicker({ maxDate: 1 });

Редактировать: вот как вы вставляете свою собственную дату, но у меня возникла проблема с правильной работой dateFormat, как вы можете видетьУ меня указан формат даты, но формат, который я на самом деле ввел, игнорирует формат даты. 

$("#txtDateStart").datepicker({dateFormat:'mm/dd/yy', minDate: new Date(2010,11,12) });
1 голос
/ 10 мая 2018

Я знаю, что это древний пост, но ошибка, возникшая в @TheMuffinMan из-за невозможности получить формат даты, работающий с опциями ограничения даты, реальна и, по-видимому, появляется только тогда, когда опции в строке, как в его пример.

Если вам нужно использовать этот формат, и если кому-то все еще интересно, можно обойти это, указав параметры форматирования даты в качестве последнего параметра в наборе. Например, приведенный ниже код работает для меня безупречно. 

var minDate = -20;
var maxDate = "+1M +10D" 

$('body').on('focus',".datepicker", function(){
    $(this).datepicker({ minDate: minDate, maxDate: maxDate },{dateFormat: "dd/mm/yy"});
});

Надеюсь, это поможет кому-то еще.

1 голос
/ 09 февраля 2018

Это сработало для меня. 

$('#date-time-picker').datepicker({
    format: 'YYYY-MM-DD',
    useCurrent: false,
    showClose: true,
    minDate: '2018-02-01',
    maxDate: '2018-03-15',
})
0 голосов
/ 05 февраля 2011

Я использовал это, и я получил выход. Спасибо всем 

 function setFiscDatePickerSettings() {

        var fSDate, fEDate, sDate, fEDate;
        var dtSettings;
        sDate = document.getElementById("<%=hdfFiscStart.ClientID %>").value.split(getSeparator(document.getElementById("<%=hdfFiscStart.ClientID %>").value));
        eDate = document.getElementById("<%=hdfFiscEnd.ClientID %>").value.split(getSeparator(document.getElementById("<%=hdfFiscEnd.ClientID %>").value));
        fSDate = new Date(sDate[2].substring(0, 4), sDate[0] - 1, sDate[1]);
        fEDate = new Date(eDate[2].substring(0, 4), eDate[0] - 1, eDate[1]);
        dtSettings = {
            changeMonth: true,
            changeYear: true,
            showOn: 'both',
            buttonImage: clientURL + 'images/calendar.png',
            buttonImageOnly: true,
            showStatus: true,
            showOtherMonths: false,
            dateFormat: 'dd/mm/yy',
            minDate: fSDate, maxDate: fEDate
        };

        return dtSettings;
    }


    function bindFiscalDatePicker() {
        var inputDt = $("input.datepicker_fisc");
        inputDt.addClass("numbers_only");
        inputDt.addClass("allow_special");
        inputDt.attr("symbolcodes", "/");
        inputDt.datepicker(setFiscDatePickerSettings());
    }
...