Soup of the Day

Please note

This is the archive for http://sam.clark.name. All commenting is disabled and there will be no further posts to this site.

TextBox Hint

After I decided to take my source site offline for the time being, I thought it would be best to post the contents here in the blog.

TextBoxHint is a Javascript script that puts a piece of hinted text into a form textbox before the user selects the box. When the box is selected, the text is instantly removed. If the user fails to input any text in the input box then the hint is restored.

Please be aware that if the user submits the form, it will pass the hints, so you will need to watch for that. I am currently working on a script to clear the hints as the form is submitted.

You can download the source javascript from http://www.polaris-digital.com/source/textBoxHint.jsï¿½

/** *ï¿½ ï¿½ ï¿½ TextBox Hint *ï¿½ ï¿½ ï¿½ Written by Sam Clark *ï¿½ Â© 2006 Polaris Digital Limited * ï¿½ ï¿½ ï¿½ Version 1.0 * *ï¿½ ï¿½ ï¿½ Released under the GNU Public Licence, Share-alike *ï¿½ ï¿½ ï¿½ You are permitted to use and modify this code, providing * ï¿½ ï¿½ ï¿½ your modifications are released under the same licence * *ï¿½ www.polaris-digital.com */ function TextBoxHInt(inputBox, textHint) { if(!document.getElementById) return false;ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // If browser does not understand, get out now! if(!document.getElementById(inputBox)) return false;ï¿½ ï¿½ ï¿½ // If text box is not found get out! var inputBoxId = document.getElementById(inputBox);ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // Assign the hbw_postcode to postCodeBox inputBoxId.value = textHint; inputBoxId.onfocus = function()ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // When the user clicks in the box { if(inputBoxId.value == textHint)ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // If the value is the default value inputBoxId.value = '';ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // Clear the box } inputBoxId.onblur = function()ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // When the user clicks away from the box { if(inputBoxId.value == '')ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // If the box is empty inputBoxId.value = textHint;ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ ï¿½ // Fill the box with instruction } }ï¿½ ï¿½ ï¿½