This is the simple demonstration in JavaScript how to create watermark text for 
        textbox control. This requirement is the mostly used in web application.
    
        Here the given codes to create the watermark text for textbox control.
For Example:
    
<head runat="server">
    
        
            
        <title>Sample for Watermark Text Using JavaScript</title>
    
        
            
        <script
        language="javascript"
        type="text/javascript">
    
        
                
        function FuncWaterMark(txtEmail, event) {
    
        
                   
        var strVal = 
        "Enter EmailID Here";
    
        
                   
        //Here to check textbox length and event 
        type
    
        
                   
        if (txtEmail.value.length == 0 & 
        event.type == "blur") {
    
        
                       
        txtEmail.style.color = "Gray";//setting text color
    
        
                       
        txtEmail.value = strVal; //setting default 
        text in textbox
    
        
                   
        }
    
        
                   
        // Here to check textbox value and event 
        type
    
        
                   
        if (txtEmail.value == strVal & event.type 
        == "focus") {
    
        
                       
        txtEmail.style.color = "black";
    
        
                       
        txtEmail.value = "";
    
        
                   
        }
    
        
                
        }
    
        
            
        </script>
    
</head>
    
<body>
    
        
            
        <form
        id="form1"
        runat="server">
    
        
            
        <div>
    
        
                
        <b>Email ID:</b>
    
        
                
        <asp:TextBox
        ID="txtEmailID"
        runat="server"
        Text="Enter EmailID 
        Here" ForeColor="Gray"
    
        
                   
        onblur="FuncWaterMark(this, 
        event);" onfocus="FuncWaterMark(this, 
        event);" />
    
        
            
        </div>
    
        
            
        </form>
    
</body>
    
</html>
    
Output:
    
No comments:
Post a Comment