|
| 1 | +<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> |
| 2 | +<link rel="stylesheet" href="dist/daterangepicker.css"> |
| 3 | +<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> |
| 4 | +<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> |
| 5 | +<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-debug.js"></script> |
| 6 | +<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script> |
| 7 | +<script src="dist/daterangepicker.js"></script> |
| 8 | +<div class="container-fluid"> |
| 9 | + <div class="row"> |
| 10 | + <div class="col-md-12"> |
| 11 | + Date: <input type="text" class=""> |
| 12 | + </div> |
| 13 | + </div> |
| 14 | +</div> |
| 15 | + |
| 16 | + |
| 17 | +<script> |
| 18 | + var month = (new Date).getMonth() + 1; |
| 19 | + var date = (new Date).getDate(); |
| 20 | + var period = 'week'; |
| 21 | + $("input").daterangepicker({ |
| 22 | + minDate: '2017/01/01', |
| 23 | + maxDate: (new Date).getFullYear() + "/" + month + "/" + date, |
| 24 | + startDate: '2019/12/08' + (period == 'month' ? '/01' : ''), |
| 25 | + endDate: '2019/12/11' + (period == 'month' ? '/31' : ''), |
| 26 | + orientation: 'right', |
| 27 | + period: period, |
| 28 | + periods: ['day', 'week', 'month'], |
| 29 | + showISOWeekNumbers: true, |
| 30 | + showWeek: true, |
| 31 | + expanded: true, |
| 32 | + firstDayOfWeek: 0, |
| 33 | + ranges: { |
| 34 | + day: { |
| 35 | + 'Today': [moment(), moment()], |
| 36 | + 'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], |
| 37 | + 'Last 7 Days': [moment().subtract(6, 'days'), moment()], |
| 38 | + 'Last 30 Days': [moment().subtract(29, 'days'), moment()] |
| 39 | + }, |
| 40 | + week: { |
| 41 | + 'This week': [moment().day(0), moment().day(6)], |
| 42 | + 'Last 1 week': [moment().subtract(1, 'weeks').day(0), moment().subtract(1, 'weeks').day(6)], |
| 43 | + 'Last 4 weeks': [moment().subtract(4, 'weeks').day(0), moment().subtract(1, 'weeks').day(6)] |
| 44 | + }, |
| 45 | + month: { |
| 46 | + 'This Month': [moment().startOf('month'), moment().endOf('month')], |
| 47 | + 'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')], |
| 48 | + 'Last 3 Months': [moment().subtract(3, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')], |
| 49 | + 'Last Year': [moment().subtract(12, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] |
| 50 | + } |
| 51 | + } |
| 52 | + }, function (startDate, endDate, period) { |
| 53 | + $(this).val(startDate.format('L') + ' – ' + endDate.format('L')) |
| 54 | + }); |
| 55 | +</script> |
0 commit comments