<html lang="en">
<head>
<style >
div.ui-datepicker{
font-size:11px;
}
</style>
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<script>
$(function() {
$( "#fromdatepicker" ).datepicker();
$( "#todatepicker" ).datepicker();
});
$(function() {
$("#btnFilter").click(function() {
var startDate = $("#fromdatepicker").datepicker("getDate");
startDate = startDate.getFullYear()+"-"+(startDate.getMonth()+1)+"-"+startDate.getDate();
var endDate = $("#todatepicker").datepicker("getDate");
endDate = endDate.getFullYear()+"-"+(endDate.getMonth()+1)+"-"+endDate.getDate();
alert(startDate +"-"+ endDate);
});
});
</script>
</head>
<body>
<p>
From Date: <input type="text" id="fromdatepicker" style="font-size:11px" />
To Date: <input type="text" id="todatepicker" style="font-size:11px" />
<input type="button" id="btnFilter" value="Generate Report">
</p>
</body>
</html>
No comments:
Post a Comment