htmljqueryflatpickr

onchange event is not woking on flatpickr() input


I have created a date picker with flatpickr() date picker is working fine. but I am trying to create an onchange event on that date picker but onchange event is not working I had tried to make a function like myfunction and call it on the input it is also not working

so can anybody help me in this

$(".flatpickr").flatpickr();
$("#flatpickr-disable-range").flatpickr({
  disable: [
    { from: "2016-08-16", to: "2016-08-19" },
    "2016-08-24", new Date().fp_incr(30) // 30 days from now
  ]
});
$(".flatpickr").change(function() {
  alert("Handler for .change() called.");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.7/flatpickr.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<div class="form-group">
  <input class="form-control flatpickr" id="set_exam_date" data-min-date="today" data-date-format="D F j, Y" placeholder="Select Date">
</div>


Solution

  • First change the order of your scripts:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.7/flatpickr.min.js"></script>
    

    Then you forgot the jQuery sign before searching for flatpickr:

    $( ".flatpickr" ).change(function() {
      alert( "Handler for .change() called." );
    });