daterangepicker-demo.js 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. /* Daterangepicker bootstrap */
  2. $(function() {
  3. "use strict";
  4. $('#daterangepicker-example').daterangepicker();
  5. });
  6. $(function() {
  7. "use strict";
  8. $('#daterangepicker-time').daterangepicker({
  9. timePicker: true,
  10. timePickerIncrement: 30,
  11. format: 'MM/DD/YYYY h:mm A'
  12. });
  13. });
  14. $(function() {
  15. "use strict";
  16. $('#daterangepicker-custom').daterangepicker({
  17. startDate: moment().subtract('days', 29),
  18. endDate: moment(),
  19. minDate: '01/01/2012',
  20. maxDate: '12/31/2014',
  21. dateLimit: {
  22. days: 60
  23. },
  24. showDropdowns: true,
  25. showWeekNumbers: true,
  26. timePicker: false,
  27. timePickerIncrement: 1,
  28. timePicker12Hour: true,
  29. ranges: {
  30. 'Today': [moment(), moment()],
  31. 'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
  32. 'Last 7 Days': [moment().subtract('days', 6), moment()],
  33. 'Last 30 Days': [moment().subtract('days', 29), moment()],
  34. 'This Month': [moment().startOf('month'), moment().endOf('month')],
  35. 'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
  36. },
  37. opens: 'left',
  38. buttonClasses: ['btn btn-default'],
  39. applyClass: 'small bg-green',
  40. cancelClass: 'small ui-state-default',
  41. format: 'MM/DD/YYYY',
  42. separator: ' to ',
  43. locale: {
  44. applyLabel: 'Apply',
  45. fromLabel: 'From',
  46. toLabel: 'To',
  47. customRangeLabel: 'Custom Range',
  48. daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
  49. monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
  50. firstDay: 1
  51. }
  52. },
  53. function(start, end) {
  54. console.log("Callback has been called!");
  55. $('#daterangepicker-custom span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
  56. }
  57. );
  58. $('#daterangepicker-custom span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
  59. });
  60. $(function() {
  61. "use strict";
  62. $('#daterangepicker-custom-2').daterangepicker({
  63. startDate: moment().subtract('days', 29),
  64. endDate: moment(),
  65. minDate: '01/01/2012',
  66. maxDate: '12/31/2014',
  67. dateLimit: {
  68. days: 60
  69. },
  70. showDropdowns: true,
  71. showWeekNumbers: true,
  72. timePicker: false,
  73. timePickerIncrement: 1,
  74. timePicker12Hour: true,
  75. ranges: {
  76. 'Today': [moment(), moment()],
  77. 'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
  78. 'Last 7 Days': [moment().subtract('days', 6), moment()],
  79. 'Last 30 Days': [moment().subtract('days', 29), moment()],
  80. 'This Month': [moment().startOf('month'), moment().endOf('month')],
  81. 'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
  82. },
  83. opens: 'left',
  84. buttonClasses: ['btn btn-default'],
  85. applyClass: 'small bg-green',
  86. cancelClass: 'small ui-state-default',
  87. format: 'MM/DD/YYYY',
  88. separator: ' to ',
  89. locale: {
  90. applyLabel: 'Apply',
  91. fromLabel: 'From',
  92. toLabel: 'To',
  93. customRangeLabel: 'Custom Range',
  94. daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
  95. monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
  96. firstDay: 1
  97. }
  98. },
  99. function(start, end) {
  100. console.log("Callback has been called!");
  101. $('#daterangepicker-custom-2 span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
  102. }
  103. );
  104. $('#daterangepicker-custom-2 span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
  105. });
  106. $(function() {
  107. "use strict";
  108. $('#daterangepicker-custom-1').daterangepicker({
  109. startDate: moment().subtract('days', 29),
  110. endDate: moment(),
  111. minDate: '01/01/2012',
  112. maxDate: '12/31/2014',
  113. dateLimit: {
  114. days: 60
  115. },
  116. showDropdowns: true,
  117. showWeekNumbers: true,
  118. timePicker: false,
  119. timePickerIncrement: 1,
  120. timePicker12Hour: true,
  121. ranges: {
  122. 'Today': [moment(), moment()],
  123. 'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
  124. 'Last 7 Days': [moment().subtract('days', 6), moment()],
  125. 'Last 30 Days': [moment().subtract('days', 29), moment()],
  126. 'This Month': [moment().startOf('month'), moment().endOf('month')],
  127. 'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
  128. },
  129. opens: 'left',
  130. buttonClasses: ['btn btn-default'],
  131. applyClass: 'small bg-green',
  132. cancelClass: 'small ui-state-default',
  133. format: 'MM/DD/YYYY',
  134. separator: ' to ',
  135. locale: {
  136. applyLabel: 'Apply',
  137. fromLabel: 'From',
  138. toLabel: 'To',
  139. customRangeLabel: 'Custom Range',
  140. daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
  141. monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
  142. firstDay: 1
  143. }
  144. },
  145. function(start, end) {
  146. console.log("Callback has been called!");
  147. $('#daterangepicker-custom-1 span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
  148. }
  149. );
  150. $('#daterangepicker-custom-1 span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
  151. });