ios/Mobile Safari changing <input> type attribute based on label?
I haven't been able to find any documentation or other reports on this through Google.
On Mobile Safari (in at least iOS6+7) I have a form containing several <input>s with type="text". A couple of these fields are for the user's email address and phone number and are labelled appropriately. As far as I can tell Mobile Safari is changing those <input>s to give them a "type" attribute that it considers appropriate to the label -- eg the email field is given type="email", and the phone number field is given type="number" (strangely, not type="tel"). For the email field this poses no problems, but the phone number field fails to render the default value because it's not in the correct format for a "number" field (the number is displayed with spaces). So far I haven't found any javascript which might be causing this.
I could understand this happening when the "type" attribute is omitted entirely, but I've double-checked that these fields are definitely rendering with type="text" and I've confirmed that all major desktop browsers are rendering the fields correctly. I even don't think it would be an issue if the phone field was changed to type="tel" as I don't think that type has any format restrictions.
I am testing on iOS through XCode's iOS simulator paired with Safari's web inspector. Here's a screen shot of the field with label "Mobile Phone" in web inspector:
And for reference here's how that field is rendering (note that no value is rendered):
Has anyone else encountered this?
Update: this jsfiddle works fine in iOS which indicates it could be a javascript issue rather than webkit, although I've so far been unable to discover any javascript which could be causing this.
Are you using any javascript code along with your HTML, things like jQuery/jQuery UI can update fields when they are set as specific types. Have you tried disabling javascript in your web view/browser to check?