Datepicker - set minDate basierend auf dem Wert eines anderen Elements

Question

Ich versuche, die datepickerminDate Eigenschaft basierend auf dem Wert eines anderen Elements festzulegen.

ich dies mit:

$("input[name='selection_itv_date']").click(function() { 

    var min_date_for_itv = $(this).closest('.selection').siblings('.application').find("input[name='job_receiving_date']").val(); 

    $("input[name='selection_itv_date']").datepicker({ 
     showButtonPanel: true, 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: "dd M yy", 
     firstDay: 1, 
     minDate: new Date(min_date_for_itv), 
     yearRange: "-1:+0" 
    }); 
}); 

Ich brauche den Wert von input[name='job_receiving_date'] auf Klick zu bekommen, weil ich auf der Seite mehrere Eingänge mit diesem Namen haben. Ich versuchte mit onSend aber keine Ergebnisse.

Ich würde wirklich jede Hilfe zu schätzen wissen.

Answer 1

Ihr aktueller Code funktioniert, aber es erfordert 2 Klicks. Das liegt daran, dass der erste Klick die Eingabe nur als Datumspicker initialisiert, sonst nichts. Wenn Sie dann auf Ihre Seite klicken und in die Eingabe zurückklicken, wird der Datumszeiger angezeigt, da er jetzt ein Datumsauswahlpunkt ist und Ihr minDate korrekt ist. Versuch es!

Offensichtlich ist das nicht sehr gut UX :-) Eine schnelle Lösung ist einfach the show method anrufen rechts, nachdem Sie die Datumsauswahl zu initialisieren:

$("input[name='selection_itv_date']").click(function() { 
    var min_date_for_itv = ... 
    $("input[name='selection_itv_date']").datepicker({ 
     ... 
    }); 

    $("input[name='selection_itv_date']").datepicker('show'); 
}); 

Eine sauberere Option könnte sein, Ihre picker unabhängig von dem Klick zu initialisieren, sagen auf Dokument bereit, und aktualisieren sie die minDate Option auf Klick:

$("input[name='selection_itv_date']").datepicker('option', 'minDate', min_date_for_itv); 

Obwohl nur zu haben versucht, dass es der Click-Handler stört den Datepicker picker~~POS=HEADCOMP aussieht und es nicht richtig angezeigt werden. Wenn der Benutzer min_date_for_itv Auswahl, am besten wäre das Update auf Ihren picker über die Änderung der dass Eingang auszulösen:

$("input[name='job_receiving_date']").on('change', function() { 
    $("input[name='selection_itv_date']").datepicker('option', 'minDate', min_date_for_itv); 
}); 

Als Nebenwirkung, wenn Sie einen Wähler mehr als einmal verwenden, ist es eine gute Idee, es zwischenzuspeichern:

var $datepicker = $("input[name='selection_itv_date']"); 

$datepicker.datepicker({ ... }); 
$datepicker.datepicker('show'); 
... etc 

Answer 2

In Ihrem Code stellen Sie die minDate für alle Eingaben ein, sobald auf einen geklickt wird. Sie sollten stattdessen den Wert minDate für den aktuell ausgewählten Eingang festlegen.

Wenn Sie die Zeile ändern

$("input[name='selection_itv_date']").datepicker({ 

zu

$("this").datepicker({ 

, wird es schaffen nur die Datumsauswahl für diesen Eingang on-the-fly.