Setze die MIN-Zeit des bootstrap clockpicker entsprechend dem Wert eines anderen Clockpickers für den gleichen Tag

Question

Ich habe vier Textfelder zwei für Datum und zwei für Zeit, um eine Erinnerung wie: vom 27/07/2017 9:00 bis 28/07/2017 zu setzen 14:05.

Ich benutze jquery datetimepicker, um Datum und bootstrap clockpicker (die Uhrstilauswahl) auszuwählen, um Zeit zu wählen.

Ich habe die letzten Daten für den zweiten datetimepicker bereits nach dem ersten ausgewählten Datum deaktiviert.

Mein Code für beide ist:

   //datetimepicker 
       $('.datetimepicker1').datetimepicker({ 
        format: 'DD/MM/YYYY', 
        minDate: moment(), 
       }); 

       $('.datetimepicker2').datetimepicker({ 
        format: 'DD/MM/YYYY', 
       }); 

       //clockpicker 
       $('.clockpicker1').clockpicker({ 
        placement: 'bottom', 
        align: 'right', 
        autoclose: true, 
        'default': '04:00', 
       //any method like afterdone to set $('.clockpicker2') MIN time 
       }); 

       $('.clockpicker2').clockpicker({ 
        placement: 'bottom', 
        align: 'right', 
        autoclose: true, 
        //set minimum time for it 
       }); 

Nun, das Problem ist, dass ich zweites Mal nach ersten ausgewählten Zeit für den gleichen Tag festlegen möchten.

Beispiel: Wenn für beide Felder das Datum 28/07/2017 ausgewählt wurde und die Zeit vom ersten Clockpicker auf 10:00 eingestellt ist, kann ich nur die Zeit nach 10 Uhr vom zweiten Clockpicker auswählen, nicht davor.

Kurz gesagt, möchten Sie den Mindestwert dieses Clockpicker auf 10:00 einstellen. Ich lese über vordahne und afterdone Methoden, habe aber keine Ahnung, wie man den MIN Wert einstellen kann.

Answer 1

Da der Autor von tackpicker die mindate-Schnittstelle nicht verfügbar gemacht hat, kann ich das Skript nur selbst schreiben. Aber min datetime spiegelt sich nicht in der Benutzeroberfläche wider (kann immer noch Zeit nach 10 Uhr vom zweiten Clockpicker auswählen, aber der Wert ändert sich nicht). Und die Frage, die wir datetimepicker2 als erstes auswählen können, wurde noch nicht berücksichtigt.

<script> 
    var flag = false; 
    $(function() { 

    $('#clockpicker1').clockpicker({ 
     placement: 'bottom', 
     align: 'right', 
     autoclose: true, 
     'default': 'now', 
     afterDone: function() { 
     $('#clockpicker2').get(0).value = $('#clockpicker1').get(0).value; 
     flag = true; 
     } 
    }); 


    $('#clockpicker2').clockpicker({ 
     placement: 'bottom', 
     align: 'right', 
     autoclose: true, 
     afterDone: function() { 
     if (flag) { 
      if ($('#clockpicker2').get(0).value < $('#clockpicker1').get(0).value) { 
      $('#clockpicker2').get(0).value = $('#clockpicker1').get(0).value; 
      } 
     } 
     } 
    }); 
    }); 
</script>