2

I have a non-nullable date field which I present in the following HTML element:

<input type="date" value="(enter date value here)"/>

By default there will always be a date in this field. However, iOS's native datepicker comes with the ability to clear the date.

There's code to validate on both the client and server that this field cannot be empty. Still, I'd rather not have this button shown at all to the user.

Is there a way I can hide it, using a special attribute or something? I don't care if the solution is targetted at iOS's Safari only.

Crono
  • 10,211
  • 6
  • 43
  • 75
  • Instead of looking for ways to change the default behavior of how a device renders UI elements, the better approach would be to perform data validation both on the UI before or during the submit and on the server when processing the incoming data. When the user submits, validate that the date is of the correct format on both the UI and the destination of the data. – gmiley Mar 13 '15 at 15:53
  • @gmiley That's something I already do. I however still want to hide this button. I do not want end users exposed to this functionality if they're not meant to be able to use it. It doesn't make sense. – Crono Mar 13 '15 at 16:52
  • 1
    @Crono Can we get a callback when user tapped on 'clear' button? If yes, please provide me approach. Thanks. – Ashok Jul 06 '17 at 06:31

1 Answers1

0

When the dateTimePicker is called, you could try and add a UIView over the picker with the appropriate background color to hide the button.

Alternatively, consider that 'clear' in the context of your app could mean 'clear what the user has selected to let them start fresh.' If they hit the clear button, just insert today or whatever date you want as a default date.

Adama
  • 1,101
  • 8
  • 26
  • Isn't UIView a native component? How can I even create such a thing from HTML / Javascript? As for your idea on "resetting" the date on "clear", the problem is that I *do* have nullable dates elsewhere in the app and I wouldn't want to confuse the end user with two different "clear" behaviors. – Crono Mar 13 '15 at 18:42
  • True about confusing 'clear' behavior. Missed the part where you were building this in HTML/JS. Don't know how to help you there. – Adama Mar 13 '15 at 20:59
  • I liked your approach. Can you tell me what is the clear button JavaScript event? – Kishore Relangi Jul 09 '17 at 04:45