iOS5 Safari only attached a date picker to one input element - html

In the following code on a web page only displays the iPhone Date picker on the first input.
<form action="#" method="post" ...>
<input type="date" name="date-from" placeholder="10/08/2012">
<input type="date" name="date-to" placeholder="10/08/2012">
</form>
Has anyone else come across this? I'm guessing it is a mobile Safari bug rather but I can't find anyone else with the same problem nor any documentation on only the first date field having the date picker attached to it.
Screenshot below for reference

Looking at the development code again, a duplicate type attribute was overriding the initial declaration. Rookie error!

Related

Input type=time is not working with min and max attributes

This question might be asked many times. But there is no clear explanation whether it is possible or not.
I have a input with type="time". I have applied min and max attributes to it. But still the picker shows all the time values and it is also possible to select any time value which not in the range.
<input type="time" id="gfg" name="Geek_time" placeholder="Enter time" min="16:00" max="22:00">
I'm checking this on android phone. This also does not work in web chrome browser.
Whereas it works fine with input type="date"
Is this behaviour expected with time input?
Only JS based validation works here and not in-built min/max?
Below is a very simple html code. Once the html is rendered, you can enter any value you like but the form will not go through. Your browser has to be compatible. Check browser compatibility.
<html>
<head>
</head>
<body>
<form>
<input type="time" id="gfg" name="Geek_time" placeholder="Enter time" min="16:00" max="22:00">
<input type="submit">
</form>
</body>
</html>
I tried entering values outside the range (less than 16:00 or more than 22:00) and then submit the form. It gave errors.

Where did the clear button go on date type input elements in Chrome?

Up until last Thursday the date type input elements used to have a clear button (a cross or "x") next to them.
Now it looks like this:
Does anyone know what has changed? How can I get the clear button back?
We are using angular and Chrome as the browser.
The HTML code below shows the problem (when Chrome is used):
<label for="birthdaytime">Birthday (date and time):</label> <input type="datetime-local" id="birthdaytime" name="birthdaytime">
It was reported as a bug:
https://bugs.chromium.org/p/chromium/issues/detail?id=1087490#c1
https://bugs.chromium.org/p/chromium/issues/detail?id=1087501
And someone in the bug discussion suggested a workaround: add a button that will clear the date-local element value:
<input id=el type=datetime-local value="2025-07-01T12:44">
<button onclick="javascript:el.value=''">X</button>
https://jsfiddle.net/cxpt4r8b/

How to disable autofill in chrome v72.0.3626.109 non-input password

After update chrome to version 72.0.3626.109, tag autocomplete off stopped work,
I'm trying use autocomplete='somestring', but not work.
Follow the image:
I tried autocomplete="false", autocomplete="off" and plugin for disable autofill, use jQuery to add attribute autocomplete, but not worked!
Sorry for my english.
I struggled with something very similar and found this question while I was searching for answers, here's how I fixed it.
My situation: I have an input field for searching, and somewhere else I had a username and password field. Chrome recently started putting the autocompleted username in the search field.
Apparently, Chrome ignores autocomplete="off" now, and goes by the string value to try to determine what type of data to autocomplete. So if you have a search box, you should put autocomplete="search" so Chrome won't put the username in there, for example.
When I first noticed a long time ago autocomplete="off" was being ignored for my search box, I switched to autocomplete="search" and that worked. Now, Chrome started putting the username in the search box again with the latest update.
The way to fix this, if your situation is similar, is to put the autocomplete field for all of your text inputs with a string describing what it is.
BEFORE:
<input id='search' type='text' autocomplete="search">
And somewhere else on the page...
<input id='login_username' type='text'>
<input id='login_password' type='password'>
AFTER
<input id='search' type='text' autocomplete="search">
And somewhere else on the page...
<input id='login_username' type='text' autocomplete="username">
<input id='login_password' type='password' autocomplete="password">
Additionally, putting the inputs in a form also affects the autocomplete, but I didn't have too much time to mess with that and I needed a quick fix to get my site working properly again. Hope this helps someone.

Datepicker in html

I have a date fields in my Form and I want user to select the dates from the calendar. however I need to create a datepicker.Searched on net still cant find the best answers.Is it possible to have a date picker in html?
You can add a datepicker in html with one of HTML5 Input Types, but also (not supported in Internet Explorer), For example :
<form action="action_page.php">
Birthday:
<input type="date" name="bday">
<input type="submit">
</form>
See DEMO from w3schools.com

I need a html5 input box type time, that works in all browsers?

Does anyone know how to create an html input box that formats time?
I have an input box and I tried giving it the type time instead of text and it doesnt work across all browsers.
I'm using angular2 with typescript and html5
I need to make sure the user types into the time input box in the correct format.
I cant seem to get any jquery solutions working for this either.
Does anyone have any good demos I can copy?
This is my current code:
<input class="form-control col-xs-6" class="timepicker" id="JobStartTime" type="time" placeholder="Start time" [(ngModel)]="jobStartTime" />
This only works in chrome.
I need this to work in all browsers
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09">
You may try like this.