Skip to content

Instantly share code, notes, and snippets.

@samithaf
Created July 19, 2014 08:04
Show Gist options
  • Save samithaf/404e496ea41f3bd53808 to your computer and use it in GitHub Desktop.
Save samithaf/404e496ea41f3bd53808 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Date Picker" />
<link href="//code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="//code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<p>Start Date: <input type="text" id="datepicker-start"></p>
<p>End Date:&nbsp;&nbsp;<input type="text" id="datepicker-end"></p>
</body>
</html>
$(function() {
$( "#datepicker-start" ).datepicker({
changeMonth: true,
changeYear: true,
onSelect: function(){
var $startDate = $( "#datepicker-start" );
var $endDate = $( "#datepicker-end" );
var startDate = $startDate.datepicker('getDate');
var endDate = $endDate.datepicker('getDate');
if((endDate && endDate < startDate) || endDate === null){
$endDate.datepicker('setDate', startDate);
}
}
});
$( "#datepicker-end" ).datepicker({
changeMonth: true,
changeYear: true,
onSelect: function(){
var $startDate = $( "#datepicker-start" );
var $endDate = $( "#datepicker-end" );
var startDate = $startDate.datepicker('getDate');
var endDate = $endDate.datepicker('getDate');
if((startDate && startDate > endDate) || startDate === null){
$startDate.datepicker('setDate', endDate);
}
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment