I'm using HTML form validation to check the user's input for various fields, like this simple ZIP code field:
<input id="zip" type="text" pattern="[0-9]{5}" title="e.g., 12345" required />
In basically all supporting browsers - Chrome, Firefox, Opera, Edge, even IE11 - if the user's input doesn't match the pattern
, the text of the title
attribute is displayed as a hint. In Chrome, for example, the following message is displayed:
Please match the requested format: e.g., 12345
But Safari merely says:
Match the requested format
...while ignoring the title
attribute, so it doesn't actually say what the requested format is.
Is there any way to get Safari to display the title
attribute, or some alternative way I can have it display a hint indicating what the requested format is?
Not exactly a fix but a work-around for this issue I found was by using the
oninvalid
attribute, thanks to this reply I found https://stackoverflow.com/a/12364405I also realised that Safari does show the title tooltip but only if you hover over the input field rather than displaying it with the validation message. Hope this answer helps.