Is there some way to clear the input-field?

[overtune]

If a user has entered a date and the change his mind, how can the field be cleared? Is there some built in feature that supports this?

I could add a button that clears the field, but perhaps it would be good to have this feature built in.

[chmln]

Good idea, but I'm rather hesitant to clutter the calendar UI with extra buttons. I'll provide a self.clear() to easily clear self.selectedDateObj, and add an example on the website.

Stay tuned

[chmln]

Added in the latest release - see example

[skworden]

example link doesn't work

[garfonzo]

https://chmln.github.io/flatpickr/examples/#flatpickr-external-elements

This example shows an additional button beside the input with an 'X' which clears the input.

[manchumahara]

In another issue put some idea

https://github.com/flatpickr/flatpickr/issues/997#issuecomment-423895091

jQuery combined example can be achieved in plain js also

if(typeof  element._flatpickr !== "undefined"){
   element._flatpickr.clear();
}
else{
 $(element).val('');
}

[prakashtsi]

In another issue put some idea

#997 (comment)

jQuery combined example can be achieved in plain js also

if(typeof  element._flatpickr !== "undefined"){
   element._flatpickr.clear();
}
else{
 $(element).val('');
}

@manchumahara Thank you Its working

[vetezeTE]

clear() function is super weird.

[usmanlogin]

very pathetic way of clearing date.

[jaimestuardo]

I have used this:

<div class="showDatePicker">
  <input class="form-control" id="FechaFin" maxlength="10" name="FechaFin" type="text" value="" />
  <a class="input-button" title="clear" data-clear>
    <i class="mdi mdi-close-circle-outline"></i>
  </a>
</div>

When attaching the flatpckr to the .showDatePicker selector, this error occurs:

TypeError: Cannot read properties of null (reading 'className')
    at flatpickr.min.js:2:39782
    at flatpickr.min.js:2:39841
    at k (flatpickr.min.js:2:49339)
    at T (flatpickr.min.js:2:49626)
    at jQuery.fn.jQuery.fn.flatpickr (flatpickr.min.js:2:50434)
    at datePickerSetup (custom.js:687:17)
    at inicializaDialogo (2:735:13)
    at HTMLDocument.<anonymous> (2:728:13)
    at e (jquery.min.js:2:26990)
    at t (jquery.min.js:2:27292)