wake-up-neo.com

Wie kann man den Datumsbereich eines JQuery Datepickers einschränken, indem man zwei Daten angibt?

Ich habe zwei Daten, die in DB gespeichert sind, und wähle sie mit $ .ajax () aus. Ich muss die Datumsauswahlwerte zwischen den Daten anzeigen, die ich in DB ausgewählt habe.

Hier ist mein Code dafür. Aber es funktioniert nicht richtig

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

Pls bieten einige lösung. Ich benötige die Datums-/Uhrzeitauswahl, die Werte zwischen diesem Bereich erfordert. Danke im Voraus

14
kbvishnu

Ihre Syntax ist falsch für das minDate/maxDate. Sie können die Dokumentation auf der jQuery-Benutzeroberflächen-Website lesen, auf der sich die Demo befindet . Ich schlage vor, dass Sie einen Blick darauf werfen, um es an Ihren speziellen Fall anzupassen. Es sieht ungefähr so ​​aus:

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

oder

das Folgende wird es so machen, dass Sie nichts vor dem heutigen Tag auswählen können.

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

und dies wird es so machen, dass Sie vor morgen nichts aussuchen können

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

Edit: So fügen Sie Ihr eigenes Datum ein, aber ich habe ein Problem damit, dass dateFormat korrekt funktioniert. Wie Sie sehen, habe ich dateFormat angegeben, aber das Format, das ich tatsächlich eingefügt habe, ignoriert das Datumsformat.

$("#txtDateStart").datepicker({dateFormat:'mm/dd/yy', minDate: new Date(2010,11,12) });
40
The Muffin Man

Das hat für mich funktioniert.

$('#date-time-picker').datepicker({
    format: 'YYYY-MM-DD',
    useCurrent: false,
    showClose: true,
    minDate: '2018-02-01',
    maxDate: '2018-03-15',
})

Ich weiß, dass dies ein alter Beitrag ist, aber der Fehler, den @TheMuffinMan mit sich brachte, das Datumsformat nicht mit den Datumseinschränkungsoptionen arbeiten zu lassen, ist real und scheint nur dann auftauchen, wenn die Optionen wie in seinem Beispiel inline sind.

Wenn Sie dieses Format verwenden müssen und noch jemand interessiert ist, können Sie die Datumsformatierungsoptionen als letzte Option in das Set einfügen. Zum Beispiel funktioniert der folgende Code für mich einwandfrei.

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

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

Ich hoffe es hilft jemand anderem.

0
Alexander

Ich habe diese verwendet und die Ausgabe erhalten. Danke

 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());
    }
0
kbvishnu