Watermark for textarea textbox using JQuery
asp.net, javascript, jquery
Solution
if you are just using the idea of watermark there are many alternatives and a lot easier way to achieve it
1) you can try using http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/TextBoxWatermark/TextBoxWatermark.aspx
2) in the HTML5 there is a new attribute for input text called placeholder that will do exactly what you want.
3) you can use more advanced jquery plugin like this it a lot easier to setup and not requires to much effort http://code.google.com/p/jquery-watermark/
here are couple more
http://wiki.jqueryui.com/w/page/12138131/Watermark
I hope it helps in certain way
Problem
i am trying to use watermark for the asp.net textbox control with jquery and below is the code i have, i see the title on my textarea textbox but when i focus or click on the textbox the watermark does not clear. i got the script from here. http://www.ajaxblender.com/howto-add-hints-form-auto-focus-using-javascript.html ``` <asp:TextBox runat="server" ID="txtNew" class="auto-hint" title="Enter here ..." TextMode="MultiLine" Rows="7" Width="100%"></asp:TextBox> <script type="text/javascript"> $(document).ready(function () { // Focus auto-focus fields $('.auto-focus:first').focus(); // Initialize auto-hint fields $('INPUT.auto-hint, TEXTAREA.auto-hint').focus(function () { if ($(this).val() == $(this).attr('title')) { $(this).val(''); $(this).removeClass('auto-hint'); } }); $('INPUT.auto-hint, TEXTAREA.auto-hint').blur(function () { if ($(this).val() == '' && $(this).attr('title') != '') { $(this).val($(this).attr('title')); $(this).addClass('auto-hint'); } }); $('INPUT.auto-hint, TEXTAREA.auto-hint').each(function () { if ($(this).attr('title') == '') { return; } if ($(this).val() == '') { $(this).val($(this).attr('title')); } else { $(this).removeClass('auto-hint'); } }); }); </script> ```