Create water mark text box in asp.net/C# using javascript within a single step
How to create a water mark text box in asp.net/C# using javascript
In some scenario in the project, we need to implement water mark text for each textboxes in the form. It will help user to give right direction to enter proper and valid entries for each textboxes. We can achieve this water mark text boxes easily by using javascript methods.
Javascript method to create water mark text boxes in ASP.Net/C# using javascript
Here we are going to create a small asp.net application to show example of water mark text box creation. In aspx page we are having a textbox for username and a button. In the textbox it will show ‘Enter username’ as water mark style with gray color. When a user click mouse on to the textbox it will hide. Once the user leave the mouse pointer from the textbox without enter any data, it will display water mark text.
ASPX PAGE WITH JAVASCRIPT FOR WATER MARK TEXTBOX
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Watermark Textbox Using JavaScript</title>
<script language="javascript" type="text/javascript">
function WaterMark(txtName, event) {
var defaultText = "Enter Username";
// Condition to check textbox length and event type
if (txtName.value.length == 0 & event.type == "blur") {
//if condition true then setting text color
//and default text in textbox
txtName.style.color = "Gray";
txtName.value = defaultText;
}
// Condition to check textbox value and event type
if (txtName.value == defaultText & event.type == "focus") {
txtName.style.color = "black";
txtName.value = "";
}
}
function WaterMarkPwd(txtName, Password) {
var defaultText = "Enter Password";
// Condition to check textbox length and event type
if (txtName.value.length == 0 & event.type == "blur") {
//if condition true then setting text color and
//default text in textbox
txtName.style.color = "Gray";
txtName.value = defaultText;
}
// Condition to check textbox value and event type
if (txtName.value == defaultText & event.type == "focus") {
txtName.style.color = "black";
txtName.value = "";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<b>UserName:</b>
<asp:TextBox ID="txtUserName" runat="server" Text="Enter Username" ForeColor="Gray"
onblur="WaterMark(this, event);" onfocus="WaterMark(this, event);" />
<asp:Button runat="server" ID="btnLogin" Text="Login" />
</div>
</form>
</body>
</html>
Leave a comment
Site Viewers
Tuvian : Discussion forum for ASP.Net,C#,Ajax,JQuery,JavaScript,HTML,CSS.. 
no comments..
Its ok to delegate cleaning services with a
reliable provider that you could definitely depend on for you to go to
a clean and healthy work place every day. Tourists who are traveling to this city generally enter
through the Bourgas Airport which is located around 30 km from the Sunny
Beach. I have and the answers have been quite interesting.
The lower shelf would support the water bath, (which will also act as a
crude smoke spreader) and the two other grates would be
where I would put the food for cooking. Folks with diabetic issues or pregnant women, don’t need to bother with salmon.
Smokers want at least some opportunity to do
so, which is the logic behind the common exemption of the bars.