Search code examples
javascriptjqueryflatpickr

flatpickr $input._flatpicker from jquery input


I use jquery in my project and I am putting the date drop down in place with flatpickr. I need to grab the existing instance of flatpickr from my date input, but using jquery it doens't work. I am looking for the answer on getting the flatpickr instance from an input that is using jquery.

function flatpickrMinDate($openDate, $closeDate) {
    const fp = $closeDate._flatpickr;
    if (fp === null || fp === undefined) return;
    fp.set('minDate', $openDate.value);
}

// this works

flatpickrMinDate(document.querySelector("#dateOpen"), document.querySelector("#dateClosed"));

// with jquery, the following does not work

flatpickrMinDate($("#dateOpen"), $("#dateClosed"));

in flatpickrMinDate, $closeDate._flatpickr returns undefined. It should return a flatpickr instance, but it returns undefined instead.


Solution

  • When using jQuery, you need to extract the DOM elements from the jQuery objects before passing them to the function. Use one of these methods to extract the element:

    flatpickrMinDate($("#dateOpen").get(0), $("#dateClosed").get(0));
    

    or

    flatpickrMinDate($("#dateOpen")[0], $("#dateClosed")[0]);