Search - Articles
DevASP.NET for ASP.NET, VB.NET, XML and C# (C-Sharp) Developers Tuesday, March 03, 2009
Dev Articles
Search Directory
SQL Server

How to show hide password characters in a TextBox in ASP.NET

Author: Jeff Nava
Download Source Code :

This article will show you how we can show hide password characters in a TextBox in ASP.NET.

It is really very easy to show and hide password characters and it has nothing to do with ASP.NET code. It is purely client-side JavaScript code. So I have used jQuery to write this simple piece of code. I have used a CheckBox to show and hide characters in a TextBox but you can use a button if you want and write your code on that button click event.

You need to download jQuery and add into your project. I have my jQuery file in Script folder.
  1. Open Visual Studio 2010
  2. File > New > Website
  3. Visual basic or Visual C# > ASP.NET Web Site
  4. Website > Add New Item > Web Form
  5. Write following tag in between head tag of aspx page

    <script type="text/javascript" src="Scripts/jquery-1.9.1.min.js"></script>

  6. Write code below in between div tag

    <table border="0" cellpadding="0" cellspacing="0">
                <asp:TextBox ID="txtPassword" runat="server" TextMode = "Password" />
            <td colspan="2" align="right">
                <asp:CheckBox ID="chkShowPassword" runat="server" Text="ShowPassword" />
  7. Now add another script tag in between head tag and write code below

    <script type="text/javascript">
        $(function () {
            $("#chkShowPassword").bind("click", function () {
                var txtPassword = $("[id*=txtPassword]");
                if ($(this).is(":checked")) {
                    txtPassword.after('<input id = "txt_' + txtPassword.attr("id") + '" type = "text" value = "' + txtPassword.val() + '" />');
                } else {

  8. Press F5 and see the result


Add Article Comment:
Name :
Email Address :
Comments :
<< How to add image in PDF file using iTextSharp in ASP.NET

Disclaimer - Privacy
© 2002-2017