Use JQuery to add a simple watermark to your asp.net textbox
The script below will let you use jQuery to place a simple watermark in your .net textbox. A good example would be a search box on your site where you want the word "search" in your textbox. When the user clicks into the textbox the word "search" will disappear.
To get this up and running you just need to make sure you have jQuery (obviously) and then you add the following javascript within your <head> tag:
The function should be easy to follow. Basically we are just checking the value of the textbox that has the class searchField on our page. If that textbox contains the word Search we are going to remove the word when the user is inside that textbox. The last part of the function is a check to ensure we don't wipe out the search term if the textbox contains a value that was entered by the user.
So now that we have our javascript we just need to make our .net textbox. You will have seen in the above code that I am looking for a class called searchField so I just need to ensure my textbox control has this css class on it.
<asp:TextBox ID="searchField" runat="server" CssClass="searchField" Text="Search" />
And that's all there is to it!
