<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- JavaScript Bundle with Popper -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
</head>
<body>
<form action="{{ url('seller/testing/search') }}" method="get">
<input type="hidden" name="start_date" id="start_date">
<input type="hidden" name="end_date" id="end_date">
<input name="date-range" id="reportrange" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
<i class="fa fa-calendar"></i>
<span></span> <i class="fa fa-caret-down"></i>
</div>
<button type="submit" id="btnSub" class="btn btn-primary">Submit</button>
</form>
<script type="text/javascript">
$(function() {
console.log(reportrange);
var start = moment().subtract(29, 'days');
var end = moment();
function cb(start, end) {
$('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
}
$('#reportrange').daterangepicker({
startDate: start,
endDate: end,
ranges: {
'Today': [moment(), moment()],
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
'year': [moment().subtract(1, 'year').startOf('year'), moment().subtract(1, 'year').endOf('year')],
'last year': [moment().subtract(1, 'year').startOf('year'), moment().subtract(2, 'year').endOf('year')]
}
}, cb);
cb(start, end);
});
$('#btnSub').click(function(){
var endDate = $('input[name="date-range"]').data('daterangepicker').endDate.format('YYYY-MM-DD'),
startDate = $('input[name="date-range"]').data('daterangepicker').startDate.format('YYYY-MM-DD');
$('#start_date').val(startDate);
$('#end_date').val(endDate);
})
</script>
</body>
</html>
0 Comments