22

I'm using a register formular on my page which should be filled by autofill if the user wants to. This works alright for all fields except birthdate with the following html:

<input id="birthDate" name="birthDate" class="select" lang="de" placeholder="dd.mm.yyyy" type="date" date-format="dd.mm.yyyy" value="" autocomplete="bday">

bday should be correct according to https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#attr-fe-autocomplete-bday

What am I missing?

I tried to add a new autocomplete address in Chrome, but seems like it doesn't give me the option to add a birthdate in the wizard: enter image description here

I can't find any information about which fields are supported by which browser unfortunately, so perhaps todays browsers don't even support it yet?

NthDegree
  • 1,301
  • 2
  • 15
  • 29
  • 4
    I've noticed the same problem. – buycanna.io Sep 25 '19 at 03:35
  • 1
    Some sites seem to suggest that `name="bday"` is the correct way to do this. But neither worked for me. It seems like Chrome at least still doesn't supporting autocompleting birthday (or if it does: not like this). – defraggled Aug 15 '20 at 15:50
  • While browser go the extra mile, *guessing* a field’s purpose based on information like the name or assigned labels (Firefox even in different languages), I’d expect the `autocomplete` attribute to be the master indicator. I found https://fill.dev/ which allows testing the different values, and found that none in Identity work in Firefox. I filed bug reports for the MDN and the compatibility table. – Andy Aug 31 '22 at 18:17
  • A lot of autocomplete features are only [partially supported in many browsers](https://caniuse.com/?search=autocomplete). – ˈvɔlə Sep 04 '22 at 15:53
  • Get rid of the date format, format needs to be YYYY-MM-DD – Grant Oct 26 '22 at 14:06
  • Well to be precise: The value format is the ISO format, but how the input mask is presented to the user depends on the navigator’s language settings. – Andy Jan 25 '23 at 13:37

4 Answers4

1

Html:

<label for="start">Start date:</label>

<input type="date" id="start" name="trip-start" value="2018-07-22" min="2018-01-01" max="2018-12-31">

CSS:

label {
display: block;
font: 2rem 'Fira Sans', sans-serif;
}
input,label {
    margin: .5rem 0;
}


label {
    display: block;
    font: 2rem 'Fira Sans', sans-serif;
}

input,
label {
    margin: .5rem 0;
}
<label for="start">Start date:</label>

<input type="date" id="start" name="trip-start" value="2018-07-22" min="2018-01-01" max="2018-12-31">
Musawar ahmed
  • 63
  • 5
0

Microsoft Edge is planning to include this feature in Edge v89 (Release planned for March 2021). Since it's based on Chromium, it's possible all derivates of Chromium don't offer support for it aswell.

El Mac
  • 3,256
  • 7
  • 38
  • 58
0

Have you tried using the autocomplete attribute inside the opening form element? eg. <form action="/action_page.php" autocomplete="on">

Kwabena
  • 1
  • 2
  • The autocomplete attribute specifies whether a form or an input field should have autocomplete on or off. Autocomplete allows the browser to predict the value. When a user starts to type in a field, the browser should display options to fill in the field, based on earlier typed values. – Bhupinder kumar Feb 04 '21 at 17:25
0

label {
    display: block;
    font: 2rem 'Fira Sans', sans-serif;
}

input,
label {
    margin: .5rem 0;
}
<label for="start">Start date:</label>

<input type="date" id="start" name="trip-start" value="2018-07-22" min="2018-01-01" max="2018-12-31 required autofill">
Tarun choudhary
  • 1
  • 2
  • Welcome to SO! Please don't post code-only answers but add a little textual explanation about how and why your approach works and what makes it different from the other answers given. You can find out more at our ["How to write a good answer"](https://stackoverflow.com/help/how-to-answer) page. – ahuemmer Dec 26 '22 at 20:04