Close date range picker programmatically?

[jwkhor]

how to close date range picker by click “Yesterday” button?

[Agustin_Carozo]

Hi Jwkhor!

I’m not sure you can, as an external trigger you can only “clear” the form

But I’ll ask the team if they have better ideas.

[dsturnerville]

Having the same issue. I think the only option may be to target with javascript or fork the component and add the trigger to close the modal. Would be great if WW could add that option to the native component.

[yma]

+1 here pleas we need this

[yma]

Clear down’t do the job unforutently

[yma]

I have this workaround by JS but you need to make sure of the element by inspect element

// Select the datepicker menu element
const datepicker = document.querySelector('.dp__menu');

// Check if the datepicker exists
if (datepicker) {
  // Option 1: Hide the datepicker by setting display to none
  datepicker.style.display = 'none';

  // Option 2: Alternatively, trigger a click outside to close (if the component listens for outside clicks)
  document.body.click();

  // Option 3: If the component has a specific close method or event, dispatch it
  // Note: This depends on the component's API, which isn't fully exposed in the HTML
  const input = document.querySelector('input[aria-describedby="datepicker"]'); // Adjust selector as needed
  if (input) {
    input.dispatchEvent(new Event('blur')); // Simulate blur to close
  }
}

// Return a status message for debugging
const status = datepicker ? 'Datepicker closed' : 'Datepicker not found';
status;