[JQUERY] jQuery Datepicker 첫 번째 날짜 필드의 선택한 날짜를 기반으로 두 번째 날짜 필드의 날짜를 제한합니다.

jQuery Datepicker 첫 번째 날짜 필드의 선택한 날짜를 기반으로 두 번째 날짜 필드의 날짜를 제한합니다.

해결법

1. ---

   1.나는 당신을 위해 JSFiddle을 만들었습니다. 나는 그것이 "속이프"라면 100 % 확신하지만 사용자가 날짜를 수동으로 입력하지 못하도록하기 위해서는 readonlye.g로 입력을 설정할 수 있습니다.

   나는 당신을 위해 JSFiddle을 만들었습니다. 나는 그것이 "속이프"라면 100 % 확신하지만 사용자가 날짜를 수동으로 입력하지 못하도록하기 위해서는 readonlye.g로 입력을 설정할 수 있습니다.

   <input type="text" id="dt1" readonly="readonly">
   

   현재 DT2 OnClose를 확인하고 날짜가 DT1S 날짜 이하 인 경우. 또한 DT1에서 날짜가 선택되면 DT2의 Mindate가 DT1 날짜 +1로 설정됩니다.

   $(document).ready(function () {
   
       $("#dt1").datepicker({
           dateFormat: "dd-M-yy",
           minDate: 0,
           onSelect: function (date) {
               var date2 = $('#dt1').datepicker('getDate');
               date2.setDate(date2.getDate() + 1);
               $('#dt2').datepicker('setDate', date2);
               //sets minDate to dt1 date + 1
               $('#dt2').datepicker('option', 'minDate', date2);
           }
       });
       $('#dt2').datepicker({
           dateFormat: "dd-M-yy",
           onClose: function () {
               var dt1 = $('#dt1').datepicker('getDate');
               var dt2 = $('#dt2').datepicker('getDate');
               //check to prevent a user from entering a date below date of dt1
               if (dt2 <= dt1) {
                   var minDate = $('#dt2').datepicker('option', 'minDate');
                   $('#dt2').datepicker('setDate', minDate);
               }
           }
       });
   });
   

   JSFiddle을 참조하십시오

2. ---

   2.내가 어떻게하는지 여기에 -

   내가 어떻게하는지 여기에 -

   데모

   코드는 다음과 같습니다

   $('#dt2').datepicker({
       dateFormat: "dd-M-yy" 
   });
   
   $("#dt1").datepicker({
       dateFormat: "dd-M-yy", 
       minDate:  0,
       onSelect: function(date){            
           var date1 = $('#dt1').datepicker('getDate');           
           var date = new Date( Date.parse( date1 ) ); 
           date.setDate( date.getDate() + 1 );        
           var newDate = date.toDateString(); 
           newDate = new Date( Date.parse( newDate ) );                      
           $('#dt2').datepicker("option","minDate",newDate);            
       }
   });
   

3. ---

   3.나는 방금 코드를 변경하여 Date2에 대한 최소 날짜가 자동으로 설정되고 date1이 Date2보다 큰 경우, date2 = date1을 설정합니다.

   나는 방금 코드를 변경하여 Date2에 대한 최소 날짜가 자동으로 설정되고 date1이 Date2보다 큰 경우, date2 = date1을 설정합니다.

     $("#dt1").datepicker({
               dateFormat: "dd/mm/yy",
               onSelect: function (date) {
                   var dt1 = $('#dt1').datepicker('getDate');
                   var dt2 = $('#dt2').datepicker('getDate');
                   if (dt1 > dt2) {
                       $('#dt2').datepicker('setDate', dt1);
                   }
                   $('#dt2').datepicker('option', 'minDate', dt1);
               }
           });
           $('#dt2').datepicker({
               dateFormat: "dd/mm/yy",
               minDate: $('#dt1').datepicker('getDate'),
               onClose: function () {
                   var dt1 = $('#dt1').datepicker('getDate');
                   var dt2 = $('#dt2').datepicker('getDate');
                   //check to prevent a user from entering a date below date of dt1
                   if (dt2 <= dt1) {
                       var minDate = $('#dt2').datepicker('option', 'minDate');
                       $('#dt2').datepicker('setDate', minDate);
                   }
               }
           });
   

from https://stackoverflow.com/questions/16373734/jquery-datepicker-restrict-dates-in-second-date-field-based-on-selected-date-in by cc-by-sa and MIT license