Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all articles
Browse latest Browse all 49308

Clearing selected value on ion-datetime

$
0
0

Trying to use a simple date picker:

But I need the value to be able to be cleared, so it goes back to its initial state (showing no date at all).

Setting the bound value to an empty string or undefined both do nothing, the display does not change (although I do get a warning about an empty string not being a valid ISO 8601 string).

Using `show-clear-button=“true” I do get a “clear” button, but when the date is “cleared”, the “target-date” slot actually shows today’s date. :frowning:

Is there really no easy way to reset the control, so there is no selected date shown, even if the underlying value is actually cleared?

I’ve managed to get nearer to the objective by overriding date-target:

<ion-datetime-button datetime="datetime">
      <span slot="date-target" :class="{hidden: dateTargetEcho === ''}">{{dateTargetEcho}}</span>
</ion-datetime-button>

dateTargetEcho has an empty string when there is no selected date, but there is still an ugly empty button floating there:

Displaying the span conditionally doesn’t work, because if my override is not there, then the one from the component is used.

<ion-datetime-button datetime="datetime">
      <span slot="date-target" v-if="dateTargetEcho !== ''">{{dateTargetEcho}}</span>
</ion-datetime-button>

3 posts - 2 participants

Read full topic


Viewing all articles
Browse latest Browse all 49308

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>