[[oktatas:web|< Web]]

====== Dátum ======

  * **Szerző:** Sallai András
  * Copyright (c) Sallai András, 2025
  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
  * Web: https://szit.hu

===== Dátumtartomány =====


==== Weblap ====

  * https://www.npmjs.com/package/bootstrap-daterangepicker
  * https://www.daterangepicker.com/

Saját megoldás GitHubon:
  * https://github.com/oktat/datumTartomany.git
==== Telepítés ====

  npm install daterangepicker

==== Használat ====


<code javascript>
{
  "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"]
}
</code>


<code html>
<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>  

</code>

==== Minimális dátum ====

<code javascript>
    $(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'));
      });
    });
</code>

==== Feliratok ====

<code javascript>
    $(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'));
      });
    });
</code>