2017-01-05 4 views
1

Ich habe eine Anforderung, bei der Startdatum und Enddatum nicht mehr als 144 Stunden Unterschied, d. H. Insgesamt 6 Tage, haben sollten.datetime picker Startdatum und Enddatum

Startdatum ist das Datumsfeld und der Benutzer wählt Datum und Uhrzeit. Im Enddatum würde Datum basierend auf ausgewähltem Datum und Uhrzeit berechnet werden. Die Zeit würde bis zu 144 Stunden betragen.

Hat jemand das implementiert? Vielen Dank im Voraus.

Grüße, Mayank

+0

lösen Es gibt viele und viele Fragen Wenn Sie zum Beispiel nach [http://stackoverflow.com/questions/29122275/set-end-date-after-select-start-date] suchen, können Sie dies tun. Die Implementierung hängt von der von Ihnen verwendeten Datepicker-Bibliothek ab, aber die Logik ist ungefähr gleich. –

Antwort

0

Ich denke, Code unten Ihr Problem

$(function() { 
 
    $("#datepicker1").datepicker(); 
 
    $("#datepicker2").datepicker(); 
 
}); 
 

 

 
function validateDiff() { 
 
    var fromdate = new Date($("#datepicker1").val()); 
 
    var todate = new Date($("#datepicker2").val()); 
 
    var validdiff = 1000 * 60 * 60 * 24; 
 

 
    console.log(fromdate); 
 
    console.log(todate); 
 

 
    var date_diff = todate - fromdate; 
 
    console.log(date_diff); 
 

 
    if (date_diff == validdiff * 6) 
 
    alert("Date Difference is 6 Days exact"); 
 
    else if (date_diff <= validdiff * 6) 
 
    alert("Date Difference is less than 6 Days"); 
 
    else 
 
    alert("Date Difference is grater than 6 Days"); 
 
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
<link rel="stylesheet" href="/resources/demos/style.css"> 
 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 

 

 

 
<p>Date From : 
 
    <input type="text" id="datepicker1"> 
 
</p> 
 
<p>Date To : 
 
    <input type="text" id="datepicker2"> 
 
</p> 
 
<button type="button" onclick="validateDiff()">Check</button>

0

Hier ist ein Beispiel für Start und Ende picker mit Jquery

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 

    <script> 
    $(document).ready(function() { 
    $("#dt1").datepicker({ 
     dateFormat: "dd-M-yy", 
     minDate: 0, 
     onSelect: function() { 
      var dt2 = $('#dt2'); 
      var startDate = $(this).datepicker('getDate'); 
      //add 30 days to selected date 
      startDate.setDate(startDate.getDate() + 30); 
      var minDate = $(this).datepicker('getDate'); 
      //minDate of dt2 datepicker = dt1 selected day 
      dt2.datepicker('setDate', minDate); 
      //sets dt2 maxDate to the last day of 30 days window 
      dt2.datepicker('option', 'maxDate', startDate); 
      //first day which can be selected in dt2 is selected date in dt1 
      dt2.datepicker('option', 'minDate', minDate); 
      //same for dt1 
      $(this).datepicker('option', 'minDate', minDate); 
     } 
    }); 
    $('#dt2').datepicker({ 
     dateFormat: "dd-M-yy" 
    }); 
}); 
    </script> 
</head> 
<body> 
<form> 
    <input type="text" id="dt1"> 
    <input type="text" id="dt2"> 
</form> 
</body> 
</html> 
Verwandte Themen