jQuery Datepicker - Limit minDate nach bisherigen Kalender

Ich habe 2 datepickers wie folgt:

$(function() {
    $( "#datepicker1, #datepicker2" ).datepicker({
    minDate: 'today',
    maxDate: "+90D",
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true,
    dateFormat: "D, dd MM, yy"
    });
});

Möchte ich datepicker2 haben die minimumdate ausgewählte Wert in der ersten Kalender + 1 Tag.(d.h., wenn die ersten Kalender Datum war 16. Mai, 2. Kalender sollte das min Datum eingestellt 17. Mai)

InformationsquelleAutor Romin | 2011-05-16

calendar jquery

12

Hatte ich das gleiche Szenario. Was ich Tat, war die minDate-Eigenschaft-Wert des zweiten datepicker in der "wählen Sie" Ereignis-handler der ersten datepicker. Arbeitete wie ein Charme.

EDIT: Hier ist ein Beispiel:
```
$("#datepicker1").datepicker({
    //normal setup parameters here
    onSelect: function (dateValue, inst) {
        $("#datepicker2").datepicker("option", "minDate", dateValue)
    }
});
```
- Bitte....Wird bekomme ich das Skript??
- Ist dies nicht für mich arbeiten.... 🙁
- was ist der inst für ?
- geben Sie einfach das Datum wie die Funktion(Datum){
InformationsquelleAutor tobias86
2

Ausführlichen Antworten hier nicht wirklich die Frage beantwortet, die lautete "wie kann ich die minDate-Eigenschaft des zweiten datepicker, auf den Wert der ersten datepicker + 1 TAG" ?

Könnte es zu spät für Euch, aber da ich ziemlich gekämpft, um eine Lösung zu finden, hier ist es :
```
$(function() {
    $( "#datepicker1" ).datepicker({
        minDate: 'today',
        maxDate: "+90D",
        showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true,
        dateFormat: "D, dd MM, yy"
        onClose: function(selectedDate, inst) {
            var selected_date = new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay);
            new_date = new Date(selected_date.getTime() + 86400000);
            new_date = jQuery.datepicker.formatDate('dd/mm/yy', new_date);
            $( "#datepicker2" ).datepicker( "option", "minDate", new_date);
  }
    });
});
```
Erläuterungen :

Haben Sie, um ein Datum-Objekt aus der datepicker1 Feld, mit Jahr, Monat, Tag.

Dann rufen Sie das Date-Objekt und verwandeln es in einen UNIX-Zeitstempel, zu dem Sie fügen Sie 86400000 ein (Anzahl der Mikrosekunden in einem Tag). Das gibt Ihnen ein neues Date-Objekt.

Danach formatieren Sie die Date-Objekt, das Sie gerade erstellt haben, um die richtige Anzeige (das kann nicht sein, das man in dieser Antwort), indem er formatDate - Methode von jQuery-DatePicker-API.

Am Ende ist, wenden Sie die minDate Ihrer datepicker2 Feld mit Ihren new_date.
- Was ist der Unterschied zwischen diesem und tobias86 Antwort? Es sieht aus wie Sie sind mit verschiedenen event-Handlern aber tut das gleiche grundlegende Sache.
- Tobias86 Antwort legt die minDate der zweite Bereich, auf den gleichen Tag wie die erste ausgewählte Feld Datum. In der Erwägung, dass meine Antwort setzt die minDate das zweite Feld als erstes Feld ausgewählte Datum + 1 Tag.
- Gotcha, wenn Sie die übergebene Datum in die onClose event-handler Sie können dies tun, mit weniger code: $( "#datepicker2" ).datepicker( "option", "minDate", new Date(selectedDate.getTime() + 86400000)). Dies fügt einen Tag auf das ausgewählte Datum, beachten Sie, dass die JS-Zeit-Stempel, die bis auf die Millisekunde.
- maxDate: "+90D", dass mir geholfen
InformationsquelleAutor Jivan
0

Haben Sie einen Blick auf die Auswahl Beispiel: http://jqueryui.com/demos/datepicker/#date-range
- $(function() { $( "#datepicker, #datepicker1, #datepicker2, #datepicker3, #datepicker4, #datepicker5, #datepicker6" ).datepicker({ minDate: 'heute', maxDate: "+90D", showOn: "button", buttonImage: "images/calendar.gif", buttonImageOnly: true, dateFormat: "D, dd MM, yy" }); });
- Eigentlich habe ich 7 datepickers....Ich habe gerade reduziert die Frage!!!!! Ich möchte jede datepicker mindate sein sollte, +1 als die bisherigen datepickers minDAte....$(function() { $( "#datepicker, #datepicker1, #datepicker2, #datepicker3, #datepicker4, #datepicker5, #datepicker6" ).datepicker({ minDate: 'heute', maxDate: "+90D", showOn: "button", buttonImage: "images/calendar.gif", buttonImageOnly: true, dateFormat: "D, dd MM, yy" }); });
- Wie Sie sehen können, in den src von die Beispiel setzen Ihre Anforderungen in onSelect: function( selectedDate ).
InformationsquelleAutor DanielB
0

Ich würde empfehlen, den DateRange-Picker von Filament Group: http://www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework/

Ich habe es in der Vergangenheit und es ist ein Kinderspiel.

InformationsquelleAutor Chris Barr

Hier ist eine andere Lösung. In diesem Zusammenhang bin ich mit "Datum Von" und "Datum" als Standard-text in datepicker.

$(function () {
        $("#DateFrom").datepicker({

            maxDate: new Date(new Date($('#DateTo').val()).valueOf()),
            beforeShow: function () {
                if ($("#DateFrom").val() == "Date From" && $("#DateTo").val() == "Date To") {
                    $("#DateFrom").datepicker('option', { minDate: null, maxDate: null });
                }

            },
            onSelect: function (dateText, inst) {
                var currentDate = new Date(dateText);
                var valueofcurrentDate = currentDate.valueOf();
                var newDate = new Date(valueofcurrentDate);
                $("#DateTo").datepicker("option", "minDate", newDate);


            }

        });

        $("#DateTo").datepicker({

            minDate: new Date(new Date($('#DateTo').val()).valueOf()),
            beforeShow: function () {
                if ($("#DateFrom").val() == "Date From" && $("#DateTo").val() == "Date To") {
                    $("#DateTo").datepicker('option', { minDate: null, maxDate: null });
                }

            },
            onSelect: function (dateText, inst) {
                var currentDate = new Date(dateText);
                var valueofcurrentDate = currentDate.valueOf();
                var newDate = new Date(valueofcurrentDate);
                $("#DateFrom").datepicker("option", "maxDate", newDate);



            }

        });



 //checking for key combinations which are allowed

        $("#DateFrom").keypress(function (e) {
            switch (e.keyCode) {
                case 46:  //delete                      
                case 8:  //backspace                       
                    break;
                default:
                    e.preventDefault();
                    break;
            }
        });

        $("#DateTo").keypress(function (e) {
            switch (e.keyCode) {
                case 46:  //delete                      
                case 8:  //backspace                      
                    break;
                default:
                    e.preventDefault();
                    break;
            }
        });
    });

InformationsquelleAutor Prasanth

Müssen Sie initialisiert datepicker.

$(document).ready(function(){    
    var dateToday=new Date();
    $("#datepicker2").datepicker();
    $("#datepicker1").datepicker({  
      minDate: dateToday,   
      onSelect:function(ui, event) { $('#datepicker2').datepicker("option","minDate",ui);}  
      });
});

Geben Sie bitte einige details zu deiner Antwort.
Welche Art von Informationen, die Sie brauchen?

InformationsquelleAutor Sulabh Singla

Versuchen Sie dies : funktioniert gut für mich

$("#datepicker1").datepicker({
    //normal setup parameters here
    onSelect: function(date) {
              var           minDateObject= new Date();//compose the date you want to set
          $( "#datepicker2" ).datepicker( "option", "minDate",minDateObject );
    }   
   });

Hoffe, wird Hilfreich sein.
Danke.

InformationsquelleAutor Kamal Pundir

$(document).ready(function(){ 
    $("#txtStartDate").datepicker({
    //pick the first date and must not max today
        dateFormat: 'dd/mm/yy',
        changeYear: true,
        maxDate: '+0D', 
    onSelect: function (dateValue){
        //onselect set the min of txtEndDate to be the current txtStartDate value
        $("#txtEndDate").datepicker({ 
        dateFormat: 'dd/mm/yy',
        changeYear: true,
        minDate: dateValue,
        maxDate: '+0D', 
    });
    }
});
});

InformationsquelleAutor JOB

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.