Solved

onKeyPress - replace text

Posted on 2011-03-16
15
653 Views
Last Modified: 2012-05-11
I have the following controls

 <asp:TextBox ID="Password" runat="server" TextMode="SingleLine"  Text="Password" >
</asp:TextBox>

<asp:HiddenField ID="uxHiddenPassword" runat="server" />

The initial value of the text box says "PASSWORD" because i have no labels on the page

however, when someone starts typing a password, i want to **** out this password
I pressume once i star it out, then this actually changes the value (its a registration form so i need to preserve their password to use for registering)
i.e. if i * it out, i dont want their password to be a bunch of stars, so i figure i have to record this in a hidden field and use that value when doing registering?

so points go to the person to who gives me the javascript that can do this

i.e. on keypress updated hidden field then replace textbox value with *
Thanks
0
Comment
Question by:websss
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 3
  • 3
  • +3
15 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 35146836
0
 

Author Comment

by:websss
ID: 35146867
Thanks

But could you explain a little more please
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 35146873
just use this

 <asp:TextBox ID="Password" runat="server" TextMode="SingleLine"  placeholder="Password">
</asp:TextBox>
0
Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

 

Author Comment

by:websss
ID: 35146907
thanks

but i have no idea how that solves my problem of *** out the password and it being available to for the registering process server side
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 35146934
<asp:TextBox ID="Password" runat="server" TextMode="SingleLine"  placeholder="Enter Password">
</asp:TextBox>

place holder will simply show the 'Enter Password' text if there is no password entered in this field. But when user enters the text in this field, it will be processed as normal password field
0
 
LVL 10

Expert Comment

by:John Claes
ID: 35146991
@ websss: :
The solution of gurvinder372 gives you a clean no scripting solution.
The value is still useable as normal and the user will see the PlaceHolder attribute value when no value is given to the password.
when the password is filled in the user will see only the ***** but the textbox will give you the entered Password

regads

poor beggar
0
 

Author Comment

by:websss
ID: 35147012
thanks both,
I wish that worked but it doesn't

no placeholder text, and password isn't hashed (it's set as singleline so i'm not suprised)
do i need a 3rd party library to acheive this or something?
0
 
LVL 9

Expert Comment

by:jkofte
ID: 35147033
you can just change textmode = "password" this will do it.
0
 
LVL 39

Expert Comment

by:Pratima Pharande
ID: 35147073
Try this ..little bit tricky
use two textboxes and hide one after key press

<asp:TextBox ID="Password1" runat="server" Text="Password" TextMode="SingleLine" style="display:block" onKeypress="change()"></asp:TextBox>
                  <asp:TextBox ID="Password2" runat="server" TextMode="Password"  style="display:none"></asp:TextBox>
                  

Javascript

            <script language="javascript" type="text/javascript">
        function change()
        {
      
         document.getElementById('Password1').style.display = "none"  ;
         document.getElementById('Password2').style.display = "block"  ;
      
        }
            </script>
0
 
LVL 1

Expert Comment

by:ChouhanR
ID: 35147328
Hey take this complete code its working fine... javascript + html

but one question i have is why dont you make the text mode as password.,, which can simplfy things to some extend..

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

<!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 runat="server">
    <title>Untitled Page</title>
    <script language="javascript" type="text/javascript" >
    function copyText(e)
    {
    var hdnfield=document.getElementById('uxHiddenPassword');
    var textBox=document.getElementById('Password');
    var c=String.fromCharCode(e.keyCode);
    hdnfield.value=hdnfield.value+c;
    e.keyCode=42;
    alert(hdnfield.value);
    }
   
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TextBox ID="Password" runat="server" TextMode="SingleLine" Text="text" onkeypress="copyText(event)"></asp:TextBox>
    <asp:HiddenField ID="uxHiddenPassword" runat="server" />
    </div>
    </form>
</body>
</html>
0
 

Author Comment

by:websss
ID: 35153808
ChouhanR, your example looks right, so I'll try this
The reason I don't use the password property on the text box is because I need it to say 'password' initially
I.e. The label is inside the text box and is I set itto password it's a bunch of ******** instead of readable text
Does that make sense?
Thank
0
 
LVL 10

Expert Comment

by:John Claes
ID: 35156963
websss:  

using the answer of gurvinder372 and jkofte combined :

<asp:TextBox ID="Password" runat="server" TextMode="password"  placeholder="Password">
</asp:TextBox>

This shows the placeHolder when empty
and **** when not empty.
the placeholders is dissapeared when focussing the textbox

poor beggar
0
 

Author Comment

by:websss
ID: 35348795
thanks poor beggar

how sure are you that the PLACEHOLDER thihng works with asp.net as i cannot get it working
?
0
 
LVL 10

Accepted Solution

by:
John Claes earned 500 total points
ID: 35349004
I've done some googling for you


This works in Chrome and any other browser that supports placeholder text in HTML5
But, it doesn't work in 3.5 and earlier of Firefox, and obviously IE8, and possibly other browsers.

So you're still not being helped.....


using JQuery (Third Party)
http://labs.thesedays.com/projects/jquery/clearfield/

using Ajax (Third Party)
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/TextBoxWatermark/TextBoxWatermark.aspx

No thirt Party
http://naspinski.net/post/Text-Input-Watermarks-using-Javascript-%28IE-Compatible%29.aspx
0
 

Author Closing Comment

by:websss
ID: 35510489
Thanks
Went for a different solution after

I had a label absolutly positions which is hidden with JS when starting typing
0

Featured Post

Secure Your Active Directory - April 20, 2017

Active Directory plays a critical role in your company’s IT infrastructure and keeping it secure in today’s hacker-infested world is a must.
Microsoft published 300+ pages of guidance, but who has the time, money, and resources to implement? Register now to find an easier way.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question