Tartalomjegyzék

< Web

Dátum

Dátumtartomány

Weblap

Saját megoldás GitHubon:

Telepítés

npm install daterangepicker

Használat

{
  "server": [
    "src",
    "node_modules/bootstrap/dist/css",
    "node_modules/bootstrap/dist/js",
    "node_modules/daterangepicker",
    "node_modules/jquery/dist",
    "node_modules/moment/min"
  ],
  "port": 3000,
  "watch": ["src"]
}
<link rel="stylesheet" href="daterangepicker.css">
 
<!-- ... -->
 
  <input type="text" name="daterange" 
  value="01/01/2018 - 01/15/2018" />
 
 
 
  <script src="bootstrap.js"></script>
  <script src="jquery.js"></script>
  <script src="moment.min.js"></script>
  <script src="daterangepicker.js"></script>
  <script src="app.js"></script> 
 
  <script>
    $(function() {
      $('input[name="daterange"]').daterangepicker({
        opens: 'left'
      }, function(start, end, label) {
        console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      });
    });
    </script>

Minimális dátum

    $(function() {
      $('input[name="daterange"]').daterangepicker({
        opens: 'left',
        locale: {
          format: 'YYYY-MM-DD',
          separator: ' - '
        },
        minDate: '2025-05-04'
      }, function(start, end, label) {
        console.log("A new date selection was made: " + 
        start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      });
    });

Feliratok

    $(function() {
      $('input[name="daterange"]').daterangepicker({
        opens: 'left',
        locale: {
          format: 'YYYY-MM-DD',
          separator: ' - ',
          applyLabel: 'Alkalmaz',
          cancelLabel: 'Mégse'
        },
        minDate: '2025-05-04'
 
      }, function(start, end, label) {
        console.log("A new date selection was made: " + 
        start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      });
    });