Select jQuery element $input._flatpicker input by flatpickr

Question

I am using jquery in my project and am using flatpickr to place the date dropdown box. I need to get an existing flatpickr instance from my date input but it doesn't work using jquery. I'm looking for an answer to using jquery to get a flatpickr instance from an input using jquery.

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

// This will work

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

// Using jquery, the following code does not work

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

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

Answer 1

When using jQuery, you need to extract the DOM elements from the jQuery object before passing them to the function. Extract elements using one of the following methods:

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

or

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