Search code examples
javascripthtmldatetimepicker

How to remove clear button from datetime-local?


I have used datetime-local input type in webview (Android Application). It shows cancel clear and set button.Is there any way to remove clear button from date time picker?

 <center><input type="datetime-local"  name="start date"  ng-model="startDateTime" id="to_date"></center>

Solution

  • It should be possible to apply normal web CSS to the contents of a Webview if you have access to those contents:

    input[type="datetime-local"]::-webkit-clear-button {
        -webkit-appearance: none;
        display: none;
        -webkit-appearance: none; 
        appearance: none;
     }
     
    <input type="datetime-local" defaultValue="2017-06-01T08:30" required>

    EDIT: I believe this method^ hid the clear button inside the input (which perhaps no longer exists) - not the clear button inside the popover. It is possible this solution is no longer relevant in current browsers. The required attribute should be the correct solution here but it doesn't seem to have the desired effect.