So I set out to add some placeholder text for login fields in my CakePHP project. First I tried the
default
attribute, and then started implementing some Javascript to clear the text from the field on focus.
Then I remembered the awesomeness that is HTML5 has introduced the placeholder
attribute to the input tag. Placeholder text appears in the input field much like default text would – the difference being that placeholder
text disappears when you start typing in the field, whilst default
text would have to be deleted.
So:
<input name="fname" type="text" placeholder="First name" />
produces
And because HTML5 is so cool, if you delete the text from the input, the placeholder
text re-appears.