Show Hide Password Using Javascript ASP.NET

Category > ASP.NET || Published on : Wednesday, February 17, 2016 || Views: 9276 || Show Hide Password Using Javascript ASP.NET


Introduction

Here Pawan Kumar will explain how to Show Hide Password Using Javascript ASP.NET

Description

In previous post I have explained JavaScript Alert Message Dialog Box, Save data to database without postback using jQuery ajax in ASP.NET, How to set focus on first textbox of the page, Assign datepicker to runtime/dynamic textboxes in ASP.NET using jQuery, Show Asp.Net Gridview Row Details using Bootstrap Tooltip on MouseHover GridView Row Cell, Best 7 Resources for 3 tier architecture Asp.Net, and many more articles.

Now I will explain How to Show Hide Password Using Javascript ASP.NET

So follow the steps to learn Show Hide Password Using Javascript ASP.NET

ASPX Code:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#chkShowHidePassword").click(function () {
                $("#txtPassword").attr('type', $(this).is(':checked') ? 'text' : 'password');
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>User Id :
                    </td>
                    <td colspan="2">
                        <asp:TextBox ID="txtUserId" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>Password :
                    </td>
                    <td>
                        <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>
                    </td>
                    <td>
                        <asp:CheckBox ID="chkShowHidePassword" runat="server" />Show password
                    </td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>

 

Conclusion:

So, In this tutorial we have learned, Show Hide Password Using Javascript ASP.NET

Download Source Codes