Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you programmatically clear HTML5 date fields?

I'm looking for a way to programmatically clear HTML5 date fields with Javascript (specifically jQuery). So far I have tried two methods which I thought obvious:

$('input[type=date]').val('');

$('input[type=date]').val('0000-00-00');

But neither of them work on the latest version of Chrome for PCs at least, haven't tried them with other browsers or platforms yet. Is there an API call or something that can clear date fields in a cross-browser way? Solutions I have searched for like this require the user to clear the date field whereas I need this to be done programmatically.

like image 688
Roy Avatar asked Jan 02 '14 15:01

Roy


People also ask

How do you reset input date?

$('input[type=date]'). val(''); $('input[type=date]'). val('0000-00-00');

How do you clear a field in Javascript?

To clear an input field after submitting:Add a click event listener to a button. When the button is clicked, set the input field's value to an empty string. Setting the field's value to an empty string resets the input.

How do I limit the date selection in HTML?

You can add a min or max attribute to the input type=date . The date must be in ISO format (yyyy-mm-dd). This is supported in many mobile browsers and current versions of Chrome, although users can manually enter an invalid date without using the datepicker.

How do I change the date format in HTML5?

To set and get the input type date in dd-mm-yyyy format we will use <input> type attribute. The <input> type attribute is used to define a date picker or control field. In this attribute, you can set the range from which day-month-year to which day-month-year date can be selected from.

How do I clear the input field in HTML?

Get hold of all the important HTML concepts with the Web Design for Beginners | HTML course. Method 1: Clearing Input on Focus. Create an input field. Method 2: Clearing Input with the help of button. Create a button. Get the id of input field.

Why can't I clear the date field on my website?

If you can't clear a date field, this could also depend on a browser bug. I spend some time until I found out that you cannot reset the date in Firefox if the date control is disabled.

How to set placeholder value for input type date in HTML 5?

How to set placeholder value for input type date in HTML 5 ? The placeholder attribute does not work with the input type Date, so place any value as a placeholder in the input type Date. You can use the onfocus=” (this.type=’date’) inside the input filed.

How to use the date picker in HTML5?

The date picker in HTML5 basically works very similar to how the JavaScript Libraries did, when we focus on the field a calendar will pop out, and then we can navigate through the months and years to select the date. Therefore, if you want the date input to use more spacing and a color scheme you could add the following to your code.


1 Answers

$("input[type=date]").val("") works for me in chrome. It sets the input field to dd/mm/yyyy.

Maybe it's browser specific. Most browsers have only partial or no support for this input: http://caniuse.com/input-datetime

like image 163
Dominik Goltermann Avatar answered Oct 30 '22 10:10

Dominik Goltermann